`
nianshi
  • 浏览: 420545 次
  • 性别: Icon_minigender_1
  • 来自: 济南
社区版块
存档分类
最新评论

很全的Flex Css参考实例

    博客分类:
  • Flex
阅读更多

CSS file 收藏

/* CSS file */

/* Global
{
color: #FFFFFF;
themeColor: #000000;
} */

Application
{
color: #FFFFFF;
backgroundColor: #000000;
backgroundImage: Embed(source="images/theme3.jpg");
backgroundSize: auto;
paddingTop: 0;
}

Accordion
{
downSkin: Embed(source="blendSkin.swf", symbol="DropDownMS_ClosedDOWN");
overSkin: Embed(source="blendSkin.swf", symbol="DropDownMS_ClosedOVER");
upSkin: Embed(source="blendSkin.swf", symbol="DropDownMS_ClosedUP");
color: #00CCCC;
textRollOverColor: #ffffff;
textSelectedColor: #ffffff;
fontFamily: Arial;
fontSize: 11;
fontWeight: normal;
borderSkin: Embed(skinClass='TextArea_borderSkin');
headerStyleName: accordionHeader;
}

Alert
{
paddingTop: 10;
paddingBottom: 10;
borderAlpha: 0.0;
backgroundAlpha: 0.0;
backgroundColor: #FFFFFF;
titleStyleName: Embed(source="blendSkin.swf", symbol="alertTitle");
fill-colors: #8F0F0F, #470808, #000000;
border-skin: ClassReference("tabNavborderBG");
headerHeight: 10;
controlBarStyleName: alertControlBar;

}

Button
{
color: #ffffff;
textRollOverColor: #000000;
skin: Embed(skinClass='PopUpButton_skin');
paddingLeft: 10;

}

ButtonBar
{
firstButtonStyleName: buttonBarFirstButton;
buttonStyleName: buttonBarButton;
lastButtonStyleName: buttonBarLastButton;
color: #E0E0E0;

}

CheckBox
{
skin: Embed(skinClass='CheckBox_icon');
icon: Embed(skinClass='CheckBox_icon');
}

ComboBox
{
skin: Embed(skinClass='Button_skin');
color: #FFFFFF;
useRollOver: true;
dropdownStyleName: comboBoxDropdown;
themeColor: #FFFFFF;
textRollOverColor: #DCDCDC;
textSelectedColor: #9A9A9A;

}

CursorManager
{
busyCursorSkin: Embed(source="blendSkin.swf", symbol="CursorManager_busyCursor");
}

ColorPicker
{
skin: Embed(skinClass='ColorPicker_skin');
focusAlpha: 0;

}

ControlBar
{
paddingLeft: 25;
paddingRight: 25;
fill-colors: #8F0F0F, #470808, #000000;
border-skin: ClassReference("titleWindowborderBG");
}

DataGrid
{
color: #000000;
borderSkin: Embed(skinClass='DropDownMS_BG');
selectionColor: #606060;
alternatingItemColors:#cccccc, #B10101;
rollOverColor: #590000;
textSelectedColor: #DCDCDC;
fontWeight: normal;
textRollOverColor: #CECECE;
headerStyleName: dataGridHeader;
headerBackgroundSkin: Embed(skinClass='boxBtn');
textAlign: center;
}

DateChooser
{
nextMonthSkin: Embed(skinClass='DateChooser_nextMonthSkin');
prevMonthSkin: Embed(skinClass='DateChooser_prevMonthSkin');
color: #981010;
todayStyleName: dateChooserToday;
disabledColor: #414141;
selectionColor: #7C7C7C;
rollOverColor: #E7E7E7;
todayColor: #BB9090;
headerStyleName: dateChooserHeader;
fontFamily: Arial;
weekDayStyleName: dateChooserWeekDay;
backgroundColor: #ADADAD;
cornerRadius: 11;
borderColor: #BD0000;

}

HRule
{
shadowColor: #222222;
}

VRule
{
shadowColor: #222222;
}

HScrollBar
{
upArrowSkin: Embed(skinClass='HScrollBar_upArrowSkin');
downArrowSkin: Embed(skinClass='HScrollBar_downArrowSkin');
thumbSkin: Embed(skinClass='VScrollBar_thumbSkin');
trackSkin: Embed(skinClass='VScrollBar_trackSkin');

}

VScrollBar
{
upArrowSkin: Embed(skinClass='VScrollBar_upArrowSkin');
downArrowSkin: Embed(skinClass='VScrollBar_downArrowSkin');
thumbSkin: Embed(skinClass='VScrollBar_thumbSkin');
trackSkin: Embed(skinClass='VScrollBar_trackSkin');

}

Label
{
color: #FFFFFF;
}

LinkButton
{
upSkin: Embed(skinClass='hyperBtn_Up');
overSkin: Embed(skinClass='hyperBtn_Over');
downSkin: Embed(skinClass='hyperBtn_Down');
textRollOverColor: #CBCBCB;
textSelectedColor: #B4B4B4;

}

List
{
color: #000000;
backgroundColor: #cccccc;
}

TileList
{
backgroundColor: #cccccc;
}

MenuBar
{
itemUpSkin: Embed(skinClass='boxBtn');
itemOverSkin: Embed(skinClass='boxBtn');
itemDownSkin: Embed(skinClass='boxBtn');
color: #F1F1F1;

}

HorizontalList
{
backgroundColor: #cccccc;
}

Panel
{
cornerRadius: 18;
paddingLeft: 5;
paddingRight: 5;
paddingTop: 5;
paddingBottom: 5;
controlBarStyleName: panelControlBar;
titleBackgroundSkin: Embed(skinClass='title_BGskin');
roundedBottomCorners: true;
backgroundAlpha: 0.0;
borderAlpha: 0.0;
}

ProgressBar
{
trackSkin: Embed(skinClass='ProgressBar_trackSkin');
barSkin: Embed(skinClass='ProgressBar_barSkin');
indeterminateSkin: Embed(skinClass='ProgressBar_indeterminateSkin');

}

RadioButton
{
skin: Embed(skinClass='RadioButton_icon');
icon: Embed(skinClass='RadioButton_icon');
}

NumericStepper
{
downArrowSkin: Embed(skinClass='NumericStepper_downArrowSkin');
upArrowSkin: Embed(skinClass='NumericStepper_upArrowSkin');

}

PopUpButton
{
upSkin: Embed(skinClass='tabs_unselected');
overSkin: Embed(skinClass='tabs_selected');
downSkin: Embed(skinClass='tabs_unselected');
textRollOverColor: #FFFFFF;
textSelectedColor: #DFDFDF;
icon: Embed(skinClass='PopUpButton_popUpIcon');
horizontalGap: 7;
popUpOverSkin: Embed(skinClass='popupBtn');
popUpDownSkin: Embed(skinClass='popupBtn2');

}

HSlider
{
thumbSkin: Embed(source="blendSkin.swf", symbol="Slider_thumbSkin");
}

VSlider
{
thumbSkin: Embed(source="blendSkin.swf", symbol="Slider_thumbSkin");
}

TabNavigator
{
borderStyle: none;
backgroundAlpha: 0;
backgroundColor: #283346;
fill-colors: #8F0F0F, #470808, #000000;
tabStyleName: "myTabs";
selectedTabTextStyleName: "myTabs";
border-skin: ClassReference("tabNavborderBG");


TabBar
{
firstTabStyleName: tabBarFirstTab;
tabStyleName: tabBarTab;
lastTabStyleName: tabBarLastTab;

}

TextInput
{
borderSkin: Embed(skinClass='searchBG');
paddingLeft: 7;
paddingTop: 2;
color: #991010;

}

TextArea
{
borderSkin: Embed(skinClass='TextArea_borderSkin');
paddingLeft: 7;
paddingRight: 7;
paddingTop: 2;
color: #991010;
}

TitleWindow
{
cornerRadius: 18;
paddingLeft: 5;
paddingRight: 5;
paddingTop: 5;
paddingBottom: 5;
fill-colors: #000000, #470808, #350606;
controlBarStyleName: panelControlBar;
titleBackgroundSkin: Embed(skinClass='title_BGskin');
border-skin: ClassReference("titleWindowborderBG");
roundedBottomCorners: true;
backgroundAlpha: 0.0;
borderAlpha: 0.0;
}

Tree
{
borderSkin: Embed(skinClass='TextArea_borderSkin');
rollOverColor: #878787;
selectionColor: #DF0000;
defaultLeafIcon: Embed(skinClass='Tree_folderOpenIcon');
folderClosedIcon: Embed(skinClass='Tree_folderClosedIcon');
folderOpenIcon: Embed(skinClass='Tree_defaultLeafIcon');
paddingLeft: 5;
paddingTop: 5;
paddingBottom: 2;

}

.myTabs {
color: #ffffff;
borderColor: #666666;
textRollOverColor: #CCCCCC;
upSkin: Embed(source="blendSkin.swf", symbol="tabs_selected");
overSkin: Embed(source="blendSkin.swf", symbol="tabs_selected");
downSkin: Embed(source="blendSkin.swf", symbol="tabs_selected");
disabledSkin: Embed(source="blendSkin.swf", symbol="tabs_selected");
selectedUpSkin: Embed(source="blendSkin.swf", symbol="tabs_unselected");
selectedOverSkin: Embed(source="blendSkin.swf", symbol="tabs_unselected");
selectedDownSkin: Embed(source="blendSkin.swf", symbol="tabs_unselected");
selectedDisabledSkin: Embed(source="blendSkin.swf", symbol="tabs_unselected");
}


.alertControlBar
{
backgroundImage: Embed(skinClass='alertTitle');
backgroundAlpha: 0.0;
borderSkin: Embed(skinClass='alertTitle');
color: #FFFFFF;
paddingTop: 25;
fontWeight: bold;
}
.dateChooserToday
{
fontFamily: Arial;
fontWeight: bold;
}
@font-face
{
fontFamily: "Arial Black";
fontWeight: normal;
fontStyle: normal;
src: local("Arial Black");
}
.dateChooserHeader
{
fontFamily: Arial;
fontWeight: bold;
}
/* @font-face
{
fontFamily: Cambria;
fontWeight: normal;
fontStyle: normal;
src: local("Cambria");
}
@font-face
{
fontFamily: "Angsana New";
fontWeight: normal;
fontStyle: normal;
src: local("Angsana New");
} */
.dateChooserWeekDay
{
fontFamily: Arial;
}
.comboBoxDropdown
{
cornerRadius: 5;
backgroundColor: #616161;
borderStyle: solid;
borderColor: #B7BABC;
rollOverColor: #363636;
selectionColor: #980000;
}
.accordionHeader
{
skin: Embed(skinClass='AccordionHeader_skin');
}
.buttonBarFirstButton
{
upSkin: Embed(skinClass='hyperBtn_Up');
overSkin: Embed(skinClass='hyperBtn_Over');
downSkin: Embed(skinClass='hyperBtn_Down');
selectedUpSkin: Embed(skinClass='hyperBtn_Over');
selectedOverSkin: Embed(skinClass='hyperBtn_Up');
selectedDownSkin: Embed(skinClass='hyperBtn_Down');
textRollOverColor: #C4C4C4;
textSelectedColor: #868686;
}
.buttonBarButton
{
upSkin: Embed(skinClass='hyperBtn_Up');
overSkin: Embed(skinClass='hyperBtn_Over');
downSkin: Embed(skinClass='hyperBtn_Down');
selectedUpSkin: Embed(skinClass='hyperBtn_Over');
selectedOverSkin: Embed(skinClass='hyperBtn_Up');
selectedDownSkin: Embed(skinClass='hyperBtn_Down');
textRollOverColor: #CCCCCC;
textSelectedColor: #9A9A9A;
}
.buttonBarLastButton
{
upSkin: Embed(skinClass='hyperBtn_Up');
overSkin: Embed(skinClass='hyperBtn_Over');
downSkin: Embed(skinClass='hyperBtn_Down');
selectedUpSkin: Embed(skinClass='hyperBtn_Over');
selectedOverSkin: Embed(skinClass='hyperBtn_Up');
selectedDownSkin: Embed(skinClass='hyperBtn_Down');
textRollOverColor: #CFCFCF;
textSelectedColor: #8E8E8E;
}
.tabBarFirstTab
{
upSkin: Embed(skinClass='popupBtn');
overSkin: Embed(skinClass='popupBtn2');
downSkin: Embed(skinClass='popupBtn');
selectedUpSkin: Embed(skinClass='popupBtn2');
selectedOverSkin: Embed(skinClass='popupBtn');
selectedDownSkin: Embed(skinClass='popupBtn2');
textRollOverColor: #E9E9E9;
textSelectedColor: #BCBCBC;
}
.tabBarTab
{
upSkin: Embed(skinClass='popupBtn');
overSkin: Embed(skinClass='popupBtn2');
downSkin: Embed(skinClass='popupBtn');
selectedUpSkin: Embed(skinClass='popupBtn2');
selectedOverSkin: Embed(skinClass='popupBtn');
selectedDownSkin: Embed(skinClass='popupBtn2');
textRollOverColor: #E1E1E1;
textSelectedColor: #B3B2B2;
}
.tabBarLastTab
{
upSkin: Embed(skinClass='popupBtn');
overSkin: Embed(skinClass='popupBtn2');
downSkin: Embed(skinClass='popupBtn');
selectedUpSkin: Embed(skinClass='popupBtn2');
selectedOverSkin: Embed(skinClass='popupBtn');
selectedDownSkin: Embed(skinClass='popupBtn2');
textRollOverColor: #DDDDDD;
textSelectedColor: #A9A9A9;
}
.dataGridHeader
{
color: #FFFFFF;
fontWeight: bold;
textAlign: center;
}
分享到:
评论

相关推荐

    Div+CSS 布局 实例 源码

    《Div+CSS布局实例源码》是一份专为学习和精通Div+CSS布局技术而设计的资源包。这个包包含了丰富的实例,旨在帮助初学者和有一定基础的学习者深入理解和掌握网页布局的核心技巧。Div+CSS是现代网页设计的基础,通过...

    css参考手册_v4.2.7_作者:飘零物语

    《CSS参考手册_v4.2.7》是飘零雾...《CSS参考手册_v4.2.7》作为全面的参考资料,不仅覆盖了以上的基本概念,还可能包括最新的CSS特性、最佳实践和实例解析,帮助开发者不断提升CSS技能,构建更具吸引力和功能性的网页。

    CSS布局实例(代码+页面)

    【CSS布局实例(代码+页面)】是一个针对初学者和进阶者的学习资源,它提供了一个实际的CSS布局应用案例,帮助理解如何使用CSS来构建网页的结构和样式。在这个实例中,我们可以深入探讨以下几个重要的CSS布局知识点...

    css参考手册4.2.4是一套最新版版的css3中文参考手册.zip

    《CSS3中文参考手册4.2.4》不仅包含以上所有内容的详细介绍,还可能包括更详细的解析、实例演示和常见问题解答,帮助开发者深入理解和应用这些特性。无论你是初学者还是经验丰富的开发者,这部手册都将是你的宝贵...

    flex连接数据库实例

    Flex是Adobe公司开发的一种富互联网应用(RIA)开发框架,主要用于构建交互性强、用户体验良好的桌面和移动设备...它涉及到Flex编程、数据服务、事件处理等多个方面,对于学习Flex开发和数据库集成具有实际的参考价值。

    《CSS网站布局实战》——实例源码包

    其中,"external.css"是压缩包中的一个关键文件,很可能是书中某个或多个实例使用的外部样式表。 CSS(Cascading Style Sheets)是一种样式表语言,用于描述HTML或XML(包括如SVG、MathML等各种XML方言)文档的呈现...

    CSS 案例(CHM) 软件大小:4.77MB.rar

    这个压缩包包含了数百个CSS的实例,旨在帮助Web页面设计师进行参考和学习,解决他们在实际工作中遇到的各种样式布局问题。这本书的英文原名是“CSS Cookbook”,可以视作一个实用的CSS技巧和解决方案的宝典,标签...

    flex+css安全手册

    这份手册深入浅出地讲解了Flex与CSS的结合使用,不仅涵盖了基本概念,还提供了丰富的实例,对于希望优化Flex应用界面和提升安全性的人来说,是一份不可多得的参考资料。通过学习和实践手册中的内容,开发者可以更...

    css3.0参考手册(腾讯技术团队整理).chm

    4. **Flexbox布局**:CSS3引入了弹性盒模型(Flexbox),通过`display: flex`和相关属性如`flex-grow`、`flex-shrink`、`flex-basis`,可以轻松实现响应式和动态布局。 5. **Grid布局**:网格布局(Grid)提供了一...

    flex布局实战搭建网页页面

    本教程将带你深入理解Flex布局,并通过实例演示如何利用HTML和CSS搭建一个网页页面。 首先,让我们了解Flex布局的核心概念。Flex布局的主要目标是解决传统CSS布局(如Block和Inline)在处理复杂或响应式布局时的...

    Flex组件MecGridWizard实例代码

    5. **样式和皮肤**:Flex支持自定义组件的外观,MecGridWizard可以通过CSS样式或皮肤来改变其颜色、字体、边框等视觉效果。通过定义皮肤类,可以全局更改组件的样式。 6. **功能扩展**:MecGridWizard可能提供了...

    css参考手册 帮助文档

    以上只是CSS参考手册中的部分关键知识点,实际手册会涵盖更多细节,包括每个属性的详细说明、兼容性信息、实例代码和最佳实践。通过深入学习和使用CSS参考手册,开发者可以提高工作效率,创建出更具吸引力和功能性的...

    css3d旋转盒子实例

    在本文中,我们将深入探讨HTML5和CSS3中的3D转换技术,特别是在创建"css3d旋转盒子"实例中的应用。3D转换是CSS3的一个重要特性,它为Web开发者提供了在网页上创建动态、立体视觉效果的能力。下面,我们将会详细讲解...

    css.rar_css

    在这个“css.rar”压缩包中,包含的“css菜单实例”是关于如何利用CSS创建各种动态和交互式菜单的实践示例,这对于网页开发者来说是极有价值的参考资料。 一、CSS基础 在深入菜单实例之前,我们需要理解CSS的基础...

    网站登录模板 HTML+CSS 实例+教程

    而"login-page[豪情].rar"可能是一个已经完成的登录页面模板,供学习者参考和下载。 综上所述,这个HTML+CSS登录页面模板实例教程将指导你从零开始构建一个完整的登录界面,包括基本的HTML结构和复杂的CSS样式设计...

    flex布局与几个实例(含源码)

    `flex-grow`定义了项目的放大比例,`flex-shrink`定义缩小比例,`flex-basis`则设置了项目的基本大小,在分配多余空间或不足空间时作为参考。 8. **order**:这个属性允许改变flex项目的排列顺序,数值越小,排列越...

    CSS 3.0 中文参考手册(CHM版).rar

    "CSS 3.0 中文参考手册"作为一本CHM版的指南,为学习者提供了详细的CSS 3.0规范解析和实例演示。jb51.net这个网站可能提供了手册的下载链接,该网站通常汇集了各种编程技术的教程和参考资料,是开发者学习和解决问题...

    Flex 4.1 语言参考

    本语言参考是离线版本,为开发者提供了全面的文档,帮助他们深入理解Flex 4.1的核心编程概念和技术。 在Flex 4.1中,ActionScript 3.0是主要的编程语言,它是一种面向对象的语言,具有强类型、类和包的结构。...

    详解CSS中的display:flex||inline-flex属性

    主要给大家介绍了CSS中的display:flex和display:inline-flex属性,文中分别通过两段实例代码给大家介绍了display:flex和display:inline-flex的使用效果,感兴趣的朋友们可以参考借鉴,下面来一起看看吧。

    CSS参考手册(Web标准布局的本质,XHTML书写规范,CSS基础与书写规范,网页头部元素的详细定义,CSS基本布局的属性,CSS容器属性)

    **CSS(层叠样式表)**是Web...本手册将详细阐述这些概念,提供实例演示和解释,帮助读者掌握CSS的各个方面,从而能够创建美观且功能强大的网页。无论你是初学者还是经验丰富的开发者,这都将是一份宝贵的参考资料。

Global site tag (gtag.js) - Google Analytics