子孫セレクタのサンプルを作りました。
(比較しやすいよう、TitleWindowやボタンは、Sparkではなく、MXを使用します。)
FlashBuilder4を使い、sdkを切り替えました。
■sdk3.5の場合
MXML
<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml” minWidth=”955″ minHeight=”600″>
<mx:Style source=”./default.css”/>
<mx:TitleWindow width=”400″ height=”300″>
<mx:ControlBar>
<mx:Button label=”ボタン1″/>
<mx:Button label=”ボタン2″/>
<mx:Button label=”ボタン3″/>
</mx:ControlBar>
</mx:TitleWindow>
</mx:Application>
CSS
/* CSS file */
ControlBar{
horizontal-align:right;
}ControlBar Button {
color:#990000;
fontSize:16;
fontWeight:bold;
}
結果
■sdk4.0の場合
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/mx” minWidth=”955″ minHeight=”600″>
<fx:Declarations>
<!– 非ビジュアルエレメント (サービス、値オブジェクトなど) をここに配置 –>
</fx:Declarations>
<fx:Style source=”./default.css”/>
<mx:TitleWindow width=”400″ height=”300″ x=”343″ y=”166″>
<mx:ControlBar>
<mx:Button label=”ボタン1″/>
<mx:Button label=”ボタン2″/>
<mx:Button label=”ボタン3″/>
</mx:ControlBar>
</mx:TitleWindow>
</s:Application>
CSS
/* CSS file */
@namespace s “library://ns.adobe.com/flex/spark”;
@namespace mx “library://ns.adobe.com/flex/mx”;mx|ControlBar{
horizontal-align:right;
}mx|ControlBar mx|Button {
color:#990000;
fontSize:16;
fontWeight:bold;
}
結果