FlexCss完全手冊

1、FLEX3中應(yīng)用CSS完全詳解手冊整理By有風(fēng)起浪來源于互聯(lián)網(wǎng).可能出現(xiàn)的細(xì)節(jié)錯誤請多包涵目錄在FLEX中使用樣式方法2一 .使用本地樣式定義2二、使用外部樣式表3三、使用內(nèi)聯(lián)樣式4四、使用setStyle()方法4五、腳本方法4Application組件樣式屬性5panel組件樣式屬性5color文本顏色6TabNavigator組件樣式屬性7color主體內(nèi)容的文本顏色8color標(biāo)簽頭文字的顏色11LinkBar組件樣式屬性12color鏈接文字顏色13List組件樣式屬性15color文字顏色18Tree組件樣式屬性18color文本顏色19TextInput組件樣式屬性19borde

2、rColor邊框顏色20CheckBox組件樣式屬性（包含單選和多選）23在FLEX中使用樣式方法一 .使用本地樣式定義使用<mx:Style>標(biāo)簽在MXML文件中創(chuàng)建本地的樣式定義。這個標(biāo)簽包含了符合CSS2.0語法的樣式表定義。這些定義會應(yīng)用到當(dāng)前文檔以及當(dāng)前文檔的子文檔。<mx:style>.solidBorder/類選擇樣式border-style:solid;button/組件定義樣式border-style:solid;.</mx:style>/應(yīng)用到組件<mx:VBoxstyleName="solidBorder"/&

3、gt;<mx:button/>/文檔中的button自動應(yīng)用樣式表中的樣式二、使用外部樣式表FLEX支持外部CSS樣式表。要應(yīng)用一個樣式表到當(dāng)前文檔和子文檔，使用<mx:Style>標(biāo)簽中的source屬性。<mx:Application.><mx:Stylesource="style/style.css"/>/載入外部樣式表.</mx:Application>style.css文件中的樣式表定義與本地樣式定義相同。三、使用內(nèi)聯(lián)樣式可以像設(shè)定組件的屬性一樣在MXML標(biāo)簽中設(shè)定樣式屬性。內(nèi)聯(lián)樣式的優(yōu)先級高于本地樣式和

4、外部樣式<mx:buttonborderStyle="solid">/設(shè)定樣式屬性四、使用setStyle()方法可以在ActionScript中使用方法來操作組件的樣式屬性。使用setStyle()方法的優(yōu)先級是最高的。<mx:Application.><mx:Script><!CDATAprivatefunctiominitButton():voidmyButton.setStyle("paddingTop",12);myButton.setStyle("paddingBottom",12

5、);></mx:Script><mx:Buttonid="myButton"initialize="initButton();">/組件初始化時調(diào)用設(shè)定樣式的五、腳本方法</mx:Application>各組件對應(yīng)的樣式屬性themeColor主題顏色：如果對色彩樣式配置不想過多的去設(shè)置的話，themeColor是一個選擇。它可以讓你選擇一種基本色彩，然后組件的邊框，外觀等色彩將會以此色彩為基礎(chǔ)構(gòu)成一組缺省的樣式，組件均可使用此樣式屬性。Application組件樣式屬性backgroundImage背景圖使用E

6、mbed(source="");來應(yīng)用backgroundColor背景色backgroundGradientColors背景漸進(jìn)色這個屬性要設(shè)置2個色彩，漸進(jìn)起始色和漸進(jìn)結(jié)束色，中間以逗號分隔backgroundGradientAlphas背景漸進(jìn)色透明度這個屬性要設(shè)置2個透明度，對應(yīng)漸進(jìn)色中的2種顏色值的范圍是0.001.00，中間以逗號分隔panel組件樣式屬性cornerRadius邊角度數(shù)panel外框邊角度數(shù)數(shù)值從0280時為直角，數(shù)值越大，圓角弧度越大headerHeight標(biāo)題頭高度panel標(biāo)題頭的高度數(shù)值從050dropShadowEnabled是否顯示

7、投影true和false2個屬性shadowDistance投影大小dropShadowEnabled為true時有效數(shù)值從020shadowDirection投影方向3個屬性leftrightcenterdropShadowColor投影的顏色roundedBottomCorners底部邊角是否為圓角true和false2個屬性若為false，則底部邊角為直角，cornerRadius對其無影響；若為true，cornerRadius對底部邊角才會起作用textAlign文字對齊方向3個屬性leftrightcenterbackgroundColor背景色除title外有內(nèi)容的部分背景色ba

8、ckgroundAlpha背景透明度除title外有內(nèi)容的部分背景透明度數(shù)值從0.001.00borderColor邊框色包括外邊框和title與主體內(nèi)容之間的邊框色borderAlpha邊框透明度包括外邊框和title與主體內(nèi)容之間的邊框透明度數(shù)值從0.001.00borderStyle邊框樣式undefined，none，solid3種樣式：默認(rèn)為undefined。當(dāng)取值為none或solid時，title與主體內(nèi)容之間將無邊框間隔或是solid樣式。borderThickness邊框厚度邊框樣式為solid時的邊框粗細(xì)程度，數(shù)值從020headerColors標(biāo)題頭背景漸變色這個屬性要

9、設(shè)置2個色彩，漸進(jìn)起始色和漸進(jìn)結(jié)束色，中間以逗號分隔footerColors底部背景漸變色這個屬性要設(shè)置2個色彩，漸進(jìn)起始色和漸進(jìn)結(jié)束色，中間以逗號分隔highlightAlphas高光透明度只針對headerColors有效。有2個數(shù)值，中間以逗號分隔前一個為高光亮度，從0.001.00，為1時最亮，為白色后一個為高光透明度，從0.001.00，為1時最透明(可通過設(shè)置制作出水晶半透明效果)color文本顏色若想設(shè)置panel中title中的字體，外觀，背景等樣式，為了不與panel中樣式相沖突，需在樣式表中定義一個引用的樣式。panel.titleStyleName:"myTit

10、leStyle". 然后新定義一個myTitleStyle樣式來設(shè)置title的樣式。TabNavigator組件樣式屬性tabHeight每個Tab的高度數(shù)值從050tabWidth每個Tab的寬度數(shù)值從0200cornerRadius邊角圓角度每個Tab中主體內(nèi)容的邊角圓角度從020注意不是Tab的邊角horizontalGap每個Tab之間的間隔寬度數(shù)值從-1020當(dāng)為負(fù)數(shù)時，Tab將會出現(xiàn)重疊horizontalAlignTab的對齊方向leftcenterrightpaddingLeft左填充距離整個一組Tab的左填充距離，數(shù)值從020.不是指每個Tab的填充距離paddi

11、ngRight右填充距離整個一組Tab的右填充距離，數(shù)值從020.不是指每個Tab的填充距離textAlign文本對齊方向每個Tab中主體內(nèi)容中的文本對齊方向leftcenterrighttextIndentTab標(biāo)題偏移度每個Tab中標(biāo)題相對于居中位置的偏移程度數(shù)值從020backgroundColor背景色Tab和Tab中主體內(nèi)容都會應(yīng)用此背景色backgroundAlpha背景色透明度只針對Tab中主體內(nèi)容的背景色有效數(shù)值從0.001.00borderStyle邊框樣式Tab中主體內(nèi)容的邊框樣式nonesolidinsetoutset四種樣式borderColor邊框顏色Tab中主體內(nèi)容

12、的邊框顏色borderThickness邊框粗細(xì)borderStyle為solid時有效數(shù)值從020dropShadowEnabled是否顯示投影true和false2個屬性shadowDistance投影大小dropShadowEnabled為true時有效數(shù)值從020dropShadowColor投影的顏色color主體內(nèi)容的文本顏色若想設(shè)置TabNavigator中tab中的樣式，為了不與TabNavigator中樣式相沖突，需在樣式表中定義一個引用的樣式。TabNavigator.tabStyleName:"myTabs".然后新定義一個myTabs樣式來設(shè)置tab

13、的樣式。myTabs中的設(shè)置cornerRadiusTab邊角圓角度每個Tab的邊角圓角度從020注意不是Tab主體內(nèi)容的邊角fillColorsTab填充漸變色未選中的Tab的填充漸變色這個屬性要設(shè)置2個色彩，漸變起始色和漸變結(jié)束色，中間以逗號分隔fillAlphasTab填充色透明度未選中的Tab的填充色透明度這個屬性要設(shè)置2個值，漸變起始色透明度和漸變結(jié)束色透明度，中間以逗號分隔，數(shù)值從0.001.00backgroundColorTab背景色選中的Tab會應(yīng)用上背景色backgroundAlphaTab背景色透明度數(shù)值從0.001.00borderColorTab邊框顏色textRol

14、lOverColor鼠標(biāo)經(jīng)過Tab時的Tab文字顏色Accordion組件樣式屬性headerHeight標(biāo)簽頭高度Accordion組件中每個標(biāo)簽頭的高度dropShadowEnabled是否顯示投影true和false2個屬性shadowDistance投影的大小從020shadowDirection投影方向leftrightcenterdropShadowColor投影的顏色borderStyle邊框的樣式nonesolidborderThickness邊框的粗細(xì)從020backgroundColor背景色整個Accordion組件包括標(biāo)簽頭和主體內(nèi)容都會應(yīng)用上背景色fillColors

15、未選中的標(biāo)簽頭填充色這個屬性要設(shè)置4個色彩值：漸變起始色，漸變結(jié)束色，鼠標(biāo)經(jīng)過時漸變起始色，鼠標(biāo)經(jīng)過時漸變結(jié)束色fillAlphas未選中的標(biāo)簽頭填充色透明度對應(yīng)于fillColors設(shè)置4個透明度數(shù)值從0.001.00selectedFillColors選中的標(biāo)簽頭填充色這個屬性要設(shè)置2個色彩值：漸變起始色，漸變結(jié)束色color標(biāo)簽頭文字的顏色textRollOverColor鼠標(biāo)經(jīng)過標(biāo)簽頭時的文字顏色textSelectedColor鼠標(biāo)點擊標(biāo)簽頭時的文字顏色textIndent標(biāo)簽頭文字縮進(jìn)距離的大小數(shù)值從0100openDuration打開新標(biāo)簽的速度數(shù)值從01000LinkBar組件

16、樣式屬性horizontalGap水平方向各鏈接之間的間隔數(shù)值從020separatorWidth間隔線的粗細(xì)各鏈接之間間隔線的粗細(xì)數(shù)值從020separatorColor間隔線的顏色borderStyleLinkBar的邊框樣式nonesolidborderColor邊框顏色borderThickness邊框粗細(xì)程度數(shù)值從020cornerRadius邊框圓角度數(shù)值從020dropShadowEnabled是否顯示邊框投影true和falseshadowDistance投影大小數(shù)值從020shadowDirection投影方向leftcenterrightdropShadowColor投影顏

17、色backgroundColor背景色backgroundAlpha背景色透明度數(shù)值從0.001.00color鏈接文字顏色disabledColor選中的鏈接文字顏色rollOverColor鼠標(biāo)經(jīng)過未選中的鏈接時的背景色textRollOverColor鼠標(biāo)經(jīng)過未選中的鏈接時的文字色selectionColor鼠標(biāo)點擊未選中的鏈接時的背景色textSelectedColor鼠標(biāo)點擊未選中的鏈接時的文字色ApplicationControlBar組件樣式屬性cornerRadius邊框圓角度數(shù)值從020dropShadowEnabled是否顯示邊框投影true和falseshadowDist

18、ance投影大小數(shù)值從020dropShadowColor投影顏色borderStyle邊框樣式defaultnonesolidborderColor邊框顏色borderThickness邊框粗細(xì)數(shù)值從020backgroundColor背景顏色fillColors填充漸變色這個屬性要設(shè)置2個色彩，漸變起始色和漸變結(jié)束色，中間以逗號分隔fillAlphas填充色透明度這個屬性要設(shè)置2個透明度漸變起始色透明度和漸變結(jié)束色透明度highlightAlphas高光透明度2個數(shù)值，中間以逗號分隔前一個為高光亮度，從0.001.00，為1時最亮，為白色后一個為高光透明度，從0.001.00，為1時最透明

19、(可通過設(shè)置制作出水晶半透明效果)backgroundColor背景色List組件樣式屬性backgroundColor背景色backgroundAlpha背景色透明度數(shù)值從0.001.00useRollOver是否使用鼠標(biāo)經(jīng)過List每一項時產(chǎn)生效果truefalserollOverColor鼠標(biāo)經(jīng)過每一項時的背景色useRollOver為true時有效textRollOverColor鼠標(biāo)經(jīng)過每一項時的文字顏色useRollOver為true時有效alternatingItemColorsList中間隔背景色這個屬性要設(shè)置2個色彩，某一項的背景色和下一項的背景色color選項文本顏色sel

20、ectionColor被選中項的背景色textSelectedColor被選中項的文字顏色textIndent選項文本縮進(jìn)距離selectionDuration被選中項漸變速度被選中項背景色變?yōu)閟electionColor中的值的速度，設(shè)置可實現(xiàn)漸變效果數(shù)值從05000值越大，漸變速度越慢 borderStyle邊框樣式  nonesolid.borderColor邊框顏色borderThickness邊框粗細(xì)數(shù)值從020dropShadowEnabled是否顯示投影true和false2個屬性shadowDistance投影大小dropShadowEnabled為true時有效數(shù)值

21、從020，shadowDirection投影方向3個屬性leftrightcenterdropShadowColor投影的顏色DataGrid組件樣式屬性backgroundColor背景色backgroundAlpha背景色透明度數(shù)值從0.001.00alternatingItemColors間隔背景顏色間隔項的顏色這個屬性要設(shè)置2個色彩，某一項的背景色和下一項的背景色headerColors標(biāo)題頭背景漸變顏色這個屬性要設(shè)置2個色彩，標(biāo)題頭背景漸變起始色和標(biāo)題頭背景漸變結(jié)束色horizontalGridLines是否顯示橫向分隔線是否顯示每一行之間的橫向分隔線truefalsehorizon

22、talGridLineColor橫向分隔線顏色horizontalGridLines為true時有效verticalGridLines是否顯示垂直方向分隔線是否顯示每一行之間的橫向分隔線truefalse此屬性只對內(nèi)容中的分隔線有效，標(biāo)題頭的分隔線是默認(rèn)的verticalGridLineColor垂直方向分隔線顏色verticalGridLineColor為true時有效useRollOver是否實現(xiàn)鼠標(biāo)經(jīng)過時的變化效果truefalserollOverColor鼠標(biāo)經(jīng)過一行時的本行背景色useRollOver為true時有效textRollOverColor鼠標(biāo)經(jīng)過一行時的本行文字顏色use

23、RollOver為true時有效（這個屬性好像無效?）color文字顏色textSelectedColor被選中行的文字顏色（這個屬性好像無效?）selectionColor被選中行的背景顏色textIndent每一行文字縮進(jìn)距離數(shù)值從030Tree組件樣式屬性backgroundColor背景色backgroundAlpha背景色透明度數(shù)值從0.001.00alternatingItemColors間隔行的顏色這個屬性設(shè)置2個色彩，某一行的背景色和下一行的背景色depthColors樹級結(jié)構(gòu)中每級的背景色這個屬性可設(shè)置多個色彩，中間以逗號分隔。對應(yīng)從樹的頂級到最后一級每1級的背景色。設(shè)置此屬

24、性會覆蓋alternatingItemColors中的設(shè)置useRollOver是否使用鼠標(biāo)經(jīng)過每一行時的效果truefalserollOverColor鼠標(biāo)經(jīng)過每一行時的背景色useRollOver為true時有效textRollOverColor鼠標(biāo)經(jīng)過每一行時的文字顏色useRollOver為true時有效borderThickness邊框的粗細(xì)數(shù)值從020color文本顏色selectionColor被選中行的背景色textSelectedColor被選中行的文本顏色textIndent文字縮進(jìn)值文字相對于圖標(biāo)的縮進(jìn)值從050indentation每一層級相對于上一層級的縮進(jìn)值從050

25、openDuration打開和關(guān)閉本層內(nèi)容的速度從01000selectionDuration被選中層級的背景色漸變速度從03000TextInput組件樣式屬性backgroundColor背景色backgroundAlpha背景色透明度數(shù)值從0.001.00color文本顏色borderStyle邊框樣式nonesolidinset outsetborderColor邊框顏色borderThickness邊框粗細(xì)borderStyle為solid時有效數(shù)值從020cornerRadius邊框圓角度borderStyle為solid時有效數(shù)值從020textIndent輸入框中內(nèi)容縮進(jìn)值數(shù)值

26、從020dropShadowEnabled是否顯示投影truefalseshadowDirection投影方向leftcenterrightshadowDistance投影大小數(shù)值從020dropShadowColor投影顏色NumericStepper組件樣式屬性backgroundColor背景色backgroundAlpha背景色透明度數(shù)值從0.001.00borderStyle邊框樣式nonesolidinsetfillColors上翻和下拉鍵的漸變填充色這個屬性要設(shè)置4個色彩值：漸變起始色，漸變結(jié)束色，鼠標(biāo)經(jīng)過時漸變起始色，鼠標(biāo)經(jīng)過時漸變結(jié)束色fillAlphas填充色透明度針對fi

27、llColors屬性這個屬性要設(shè)置4個透明度漸變起始色透明度漸變結(jié)束色透明度鼠標(biāo)經(jīng)過時漸變起始色透明度鼠標(biāo)經(jīng)過時漸變結(jié)束色透明度數(shù)值從0.001.00highlightAlphas高光透明度針對fillColors屬性2個數(shù)值，中間以逗號分隔前一個為高光亮度，從0.001.00，為1時最亮，為白色后一個為高光透明度，從0.001.00，為1時最透明dropShadowEnabled是否顯示投影truefalseshadowDirection投影方向leftcenterrightshadowDistance投影大小數(shù)值從020dropShadowColor投影顏色ComboBox組件樣式屬性color所有選項中文本顏色borderColor邊框顏色cornerRadius邊框圓角度數(shù)值從020fillColors被選擇項的漸變填充色這個屬性要設(shè)置4個色彩值：漸變起始色，漸變結(jié)束色，鼠標(biāo)經(jīng)過時漸變起始色，鼠標(biāo)經(jīng)過時漸變結(jié)束色fillAlphas填充色透明度針對fillColors屬性這個屬性要設(shè)置4個透明度漸變起始色透明度漸變結(jié)束色透明度鼠標(biāo)經(jīng)過時漸變起始色透明度鼠標(biāo)經(jīng)過時漸變結(jié)束色透明度數(shù)值從0.001.00highlightAlphas高光透明度針對fillColors屬性2個數(shù)值，中間以逗號分隔前一個為高光亮度，從0.001.00，