Flex3中应用CSS的样式详解

本篇内容主要讲解“Flex3中应用CSS的样式详解”，感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷，实用性强。下面就让小编来带大家学习“Flex3中应用CSS的样式详解”吧!

在Flex3中使用样式方法

一、使用本地样式定义

使用<mx:Style>标签在MXML文件中创建本地的样式定义。这个标签包含了符合CSS2.0语法的样式表定义。这些定义会应用到当前文档以及当前文档的子文档。

<mx:style>  .solidBorder{//类选择样式   border-style:solid;   }   button{//组件定义样式   border-style:solid;   }  ....   </mx:style>  //应用到组件   <mx:VBoxstyleNamemx:VBoxstyleName="solidBorder"/>  <mx:button/>//文档中的button自动应用样式表中的样式

二、使用外部样式表

Flex3支持外部CSS样式表。要应用一个样式表到当前文档和子文档，使用<mx:Style>标签中的source属性。

<mx:Application...>  <mx:Stylesourcemx:Stylesource="style/style.css"/>//载入外部样式表   ...   </mx:Application>

style.css文件中的样式表定义与本地样式定义相同。

三、使用内联样式

可以像设定组件的属性一样在MXML标签中设定样式属性。内联样式的优先级高于本地样式和外部样式。

<mx:buttonborderStylemx:buttonborderStyle="solid">//设定样式属性

四、使用setStyle()方法

可以在ActionScript中使用方法来操作组件的样式属性。使用setStyle()方法的优先级是***的。

<mx:Application...>  <mx:Script>  <![CDATA[privatefunctiominitButton():void{myButton.setStyle("paddingTop",12);myButton.setStyle("paddingBottom",12);}]]>  </mx:Script>  <mx:Buttonidmx:Buttonid="myButton"initialize="initButton();">//组件初始化时调用设定样式的

到此，相信大家对“Flex3中应用CSS的样式详解”有了更深的了解，不妨来实际操作一番吧！这里是亿速云网站，更多相关内容可以进入相关频道进行查询，关注我们，继续学习！