css 表现样式规约

《css 表现样式规约》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、表现样式规约一.前言关于样式的设计分为两类：一是表现样式，主要定义样式的表现形式，用基本样式类定义实现；一是功能样式，主要是定义样式的功能，通过定义behavior属性调用htc文件实现不同的功能。本文档主要是描述前者的规约。二.分类在表现样式中存在分组和不分组两类样式，分组样式指的是定义一组规定样式类来展现某种页面构成，可以在该样式类前加参数（如：A、B、C、D）来扩展该类样式的显示风格，不分组样式指的是定义的样式适用全局，不需要扩展定义的，如Body、A等。外网命名方式：样式命名方式：　L1AL1BL1C　L代表左边　1代表首页　ABC　代表来扩展该类样式的显示风格C1A　C

2、1B　C1C　C代表中间　1代表首页　ABC　代表来扩展该类样式的显示风格R1A　R1B　R1CR代表右边　1代表首页　ABC　代表来扩展该类样式的显示风格L2A　L2B　L2C　L代表左边　2代表二级页面　ABC　代表来扩展该类样式的显示风格R2A　R2B　R2CR代表左边　2代表二级页面　ABC　代表来扩展该类样式的显示风格L3A　L3B　L3C　L代表左边　3代表三级页面　ABC　代表来扩展该类样式的显示风格R2A　R2B　R2CR代表左边　3代表三级页面　ABC　代表来扩展该类样式的显示风格一.表现规约1.分类样式1.1表单类1.1.1定义CSS样式类名相关描述Title

3、Icon主表格第一行标题区最左端TD包含图标的定义，占表格的20％Title主表格第一行标题区中间TD包含标题的定义，占表格的60％TitleIconR主表格第一行标题区最右端TD占表格的20％ItemCol嵌套表格第一行，属于项目标题区定义每个功能项目都包含哪些列，其中最左端显示一个复选框，用于选中所有内容Body主表格第二行的嵌套表格包含边框样式的定义。页面区域中需要填充的具体内容放置在嵌套表格中ItemIcon嵌套表格每一行左端TD包含项目符号的定义，属于信息项区Item1嵌套表格奇数行除最左端外每个TD，属于信息项区Item2嵌套表格偶数行除最左端外每个TD，属于信息项区

4、ItemExt嵌套表格中的一行，也可以与标题区或信息项区的最后一行共用一行，属于扩展区（如：更多）ItemFunc嵌套表格中的一行，用于放置进行操作的功能按钮。属于功能区合计Table类共有10项CSS样式类1.1.2Demo查看用法TitleIconTitleTitleIconRItemColItemIconItem1ItemIconItem1ItemIconItem1ItemIconItem2ItemExtItemFuncBody1.1.1子类定义1.1.1.1左边下拉菜单类LeftMenu样式类CSS样式类名左边下拉菜单类(LeftMenu开头)TitleIconTitle

5、TitleIconRItemIconItem1Item2Body合计7个查看用法LeftMenuTitleIconLeftMenuTitleLeftMenuTitleIconRItemIconItem1ItemIconItem1ItemIconItem1ItemIconItem2Body1.1.1.2编辑表单Edit类样式类CSS样式类名信息抽取子类(Edit)TitleIconTitleTitleIconRItemExtBodyItem1Item2ItemIcon合计8个查看用法EditTitleIconEditTitleEditTitleIconRItemIconItem1I

6、temIconItem1ItemIconItem1ItemExtBody1.1.1.1搜索子类Search样式类CSS样式类名搜索子类(Search)TitleIconTitleTitleIconRBodyItemExt合计5个查看demo1.1.1.2多行子类如：外网的左边子类的样式L1A　L代表左边　1代表首页　ABC　代表来扩展该类样式的显示风格样式类CSS样式类名多行子类（L1A）TitleIconTitleTitleIconRBodyItem1Item1合计6个查看demo1.1.1.3登录类Login样式类CSS样式类名登录类(Login)TitleIconTitle

7、TitleIconRBodyItem1Item2ItemExt合计7个查看demo1.1.1.1组织模型子类样式类CSS样式类名组织模型子类TitleIconTitleTitleIconRBodyItemFunc合计5个查看demo1.2导航类1.2.1定义CSS样式类名相关描述NaviItem默认状态NaviItemOver其鼠标悬停时的状态NaviSelect选中后状态合计Navigate类共有3项CSS样式类1.2.2Demo查看demo1.3缩进控制类1.3.1定义CSS