Flex应用中引入CSS

Flex应用中引入CSS

 

像HTML一样要用CSS控制样式，Flex也一样。在Flex应用程序中我们可以将样式定义在<fx:Style>标签对中。如：

 

   <fx:Style>

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

       @namespace mx "library://ns.adobe.com/flex/mx";

       @namespace tt "components.*";

 

       s|Button

       {

           color:red;

       }

 

       tt|Person

       {

           color:yellow;

       }

   </fx:Style>

 

说明：

 

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

       @namespace mx "library://ns.adobe.com/flex/mx";

 

上面两个是默认的命名空间，s为前缀，s|Button表示为Button组件定义样式

 

而@namespace tt "components.*";则是自定义的命名空间，tt|Person表示为自定义的组件Person定义样式。

 

当然这样将CSS代码放在应用程序的<fx:Style>标签对中，不好维护，所以我们可以将<fx:Style>标签对中的代码放在一个css文件中，然后引用，这样更利于维护及代码复用。

 

Eg:我们将css样式放在一个CSS/teana.css的文件中，我们在应用程序中可以通过<fx:Style source=”CSS/teana.css” />引用CSS样式。