CSS文件如下:
/* CSS file */ @namespace s "library://ns.adobe.com/flex/spark"; @namespace mx "library://ns.adobe.com/flex/halo"; /*-----------1、全局选择：定制全局样式-----------*/ mx|Button s|Button{ ?? ?color: #FF0000; } s|Button{ ?? ?color: #FF00FF; } /*-----------2、全局选择器：可在组件的属性里面指定样式类，然后在css中声明相应的样式类-----------*/ .myStyleClass{ ?? ?backgroundColor: #000000; ?? ?color:#0000FF; } /*-----------3、ID选择：组件ID设置相应的组件样式-----------*/ #can01ID{ ?? ?backgroundColor: #0000FF; } /*-----------4、派生选择：类里面的组件ID来定义样式-----------*/ s|VGroup#vGroupID mx|ProgressBar{ ?? ?color:#FF0000; } /*-----------5、状态选择：通过状态定义样式，只适用于Button组件-----------*/ s|Button:down{ ?? ?fontSize:20; ?? ?color:#FF0000; } mxml文件如下: <?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" ?? ??? ??? ??? xmlns:s="library://ns.adobe.com/flex/spark" ?? ??? ??? ??? xmlns:mx="library://ns.adobe.com/flex/halo" ?? ??? ??? ??? minWidth="1024" minHeight="768"> ?? ? ?? ?<fx:Style source="hello.css"/> ?? ? ?? ?<!--1、全局选择：定制全局样式--> ?? ?<mx:Button id="s01ID" x="500" y="20" label="方式1_1号"/> ?? ?<s:Button id="s02ID" x="500" y="50" label="方式1_2号" /> ?? ? ?? ?<!--2、全局选择器：可在组件的属性里面指定样式类，然后在css中声明相应的样式类--> ?? ?<mx:Canvas id="s03ID" x="500" y="100" width="200" height="100" styleName="myStyleClass"/> ?? ? ?? ?<!--3、ID选择：组件ID设置相应的组件样式--> ?? ?<mx:Canvas id="can01ID" x="500" y="220" width="200" height="100"/> ?? ? ?? ?<!--4、派生选择：类里面的组件ID来定义样式--> ?? ?<s:VGroup id="vGroupID" x="500" y="350"> ?? ??? ?<mx:ProgressBar id="progressBarID"/> ?? ?</s:VGroup> ?? ? ?? ?<!--5、状态选择：通过状态定义样式，只适用于Button组件--> ?? ?<s:Button id="can02ID" x="500" y="450" width="200" height="100" label="方式5"/> ?? ? </s:Application>
