如何使用Flex 4新的CSS文法，相容halo元件

前台<mx:Button id="btn_ready">

CSS現在提供了進階選擇，命名空間等許多特征，讓我們看看如何使用它。

我們在這裡展示幾個應用樣式的方式：跟随命名空間的全局選擇，ID選擇，派生選擇和狀态選擇。

我的應用

這個例子中，我使用了2個Button（1個是Halo主題，1個是spark主題）和1個在VGroup中的ProgressBar：

命名空間聲明

在這種情況下，如果我要為1個元件應用樣式，我必須在選擇子前面聲明命名空間(例如，s|Button{style…})。如果你确定你的項目中基本上都是使用Spark元件，可以把Spark命名空間做為預設命名空間：

這樣，對于前一個例子，你就不需要額外聲明”s|”

全局選擇

當然，也可以為元件聲明一個stylename屬性然後使用類選擇器，文法如下：

ID選擇

我隻想特定的元件改變基礎色，于是我用ID的方式來選擇：

派生選擇

我想要VGroup中的ProgressBar的文字顯示紅色

狀态選擇

我想要我的Spark Buttons的label在使用者點選的時候（這是目前狀态時”down”）顯示綠色。

結論

假如在開發Flex之前，你有HTML/CSS的經驗，那就知道以前的CSS功能十分有限。而現在新的文法會讓元件換膚更加容易。