声明Flex CSS样式的基本方法有哪些

本篇内容介绍了“声明Flex CSS样式的基本方法有哪些”的有关知识，在实际案例的操作过程中，不少人都会遇到这样的困境，接下来就让小编带领大家学习一下如何处理这些情况吧！希望大家仔细阅读，能够学有所成！

Flex内的CSS

首先，对于具有Web设计背景的人，最为重要的是要理解Flex CSS样式并不遵循与W3CCSS规定相同的约定。在W3CCSS版本2.0中被用来分离单词的连字符（-）并未用作Flex实现内的代码约定的一部分。相反，CSS的Flex实现使用了驼峰式大小写。比如，W3CCSS2规范内的vertical-center对等于FlexCSS内的verticalCenter。

如果您已经在使用了驼峰式大小写的编程语言内进行过编程，那么，这非常容易习惯。好的消息是CSS2.0规范内可用的大部分内容在FlexCSS实现内也可用。并且，CSS的Flex实现是在CSS2.0W3C标准上的显著扩展，提供了额外的、对Flex组件惟一的样式属性。

维护样式：组件与Flex CSS样式属性

在开始创建Flex CSS样式表之前，我建议您首先考虑您想要如何实现样式。出于简单性的考虑，我向您展示了四种声明样式的基本方法：

◆通过组件的类名。通过将组件的类名作为样式名来设置组件的样式：

TitleWindow{  borderColor:#f7f7f7;  borderAlpha:1;  borderThicknessLeft:0;  borderThicknessTop:0;  borderThicknessBottom:0;  borderThicknessRight:0;  cornerRadius:0;  headerHeight:0;  highlightAlphas:1,1;  headerColors:#f7f7f7,#f7f7f7;  footerColors:#f7f7f7,#f7f7f7;  backgroundColor:#f7f7f7;  dropShadowEnabled:true;  }

◆通过一个惟一的样式名。通过使用一个惟一的Flex CSS样式名来声明样式。请确保在名字之前使用一个句点并使用驼峰式大小写约定：

.altText

{   fontFamily:TVNordEFCEOP-RegularCon;   fontSize:18;   color:#FFFFFF;  }

◆通过一个组件外加一个样式名。当同一个组件需要有多种设计时（这对于具有多个视图状态的应用程序很常见），可以设置组件的样式名。这种方法还确保了只有特定的组件才可以分配到特定的样式：

Text.bigYellowText  {   color:#EFB526;   fontSize:36;   fontWeight:Bold;  }

◆通过全局选择器。全局选择器是一种特殊的选择器，它能够影响包含属性集的应用程序内的每一个组件。比如，我可以将包含有cornerRadius样式属性的所有显示对象组件的cornerRadius样式属性设置为4，如下所示：

global  {   cornerRadius:4;   }

Flex CSS样式优先权

虽然全局选择器基本上设置的是一个属性的默认值，该值很容易被覆盖。比如，如果我在内联（inline）或在我的CSS文件内将Button组件的cornerRadius属性设置为0，它将优于我已经指定的4这一全局默认设置；因此，所有我的Button组件都将包含一个值为0的cornerRadius属性。而且，我将通过创建一个额外的样式来覆盖4这一全局设置和0这一Button设置：

Button.altCornersButton  {   cornerRadius:8;   }

“声明Flex CSS样式的基本方法有哪些”的内容就介绍到这里了，感谢大家的阅读。如果想了解更多行业相关的知识可以关注亿速云网站，小编将为大家输出更多高质量的实用文章！