flex4 css语法

阅读更多

我们将展示以下几种例子：通过命名空间来定义全局CSS样式；通过具体组件的ID来定义个别组件的样式；通过类里面的组件ID来定义样式；通过组件样式定义样式。

详细说明：

首先让我们新建一个application。如下。包含两个按钮（一个Halo按钮和一个Spark按钮）和一个包含在容器VGroup里面progressBar。代码如下：




xmlns:s=”library://ns.adobe.com/flex/spark”

xmlns:mx=”library://ns.adobe.com/flex/halo” minWidth=”1024″ minHeight=”768″>

       

       

               

       

       

       

       

               

       



在CSS里面需要导入相应的命名空间，如：

@namespace s “library://ns.adobe.com/flex/spark”;

@namespace mx “library://ns.adobe.com/flex/halo”;

定制全局样式

mx|Button

{

color:#ffffff;

}

s|Button

{

color:#000000;

}

当然也可在组件的属性里面指定样式类，然后在css中声明相应的样式类

.myStyleClass

   {

   color:#ff0000;

   }

组件ID设置相应的组件样式

#haloButton

   {

   base-color:#0000ff;

   }

#sparkButton

   {

   base-color:#ffffff;

   }

类里面的组件ID来定义样式

s|VGroup#myBox mx|ProgressBar

   {

   color:#ff0000;

   }

通过状态定义样式

s|Button:down

   {

   color:#33CC33;

   }

总结：

通过这些语法，我们能够更轻松的为组件制作样式了。