div命名参考.doc

div+css命名规则 常用代码结构：div：主要用于布局，分割页面的结构ul/ol：用于无序/有序列表span：没有特殊的意义，可以用作排版的辅助，例如：1. (4.23)隐居豆腐店 然后在css中定义span为右浮动，实现了日期和标题分两侧显示的效果h1-h6：标题h1-h6 根据重要性依次递减h1位最重要的标题label：为了使你的表单更有亲和力而且还能辅助表单排版的好东西，例如：1. 密码 2. 3. fieldset & legend：fildset套在表单外，legend用于描述表单内容。例如： 4. 5. 6. title 7. 密码 8. 9. 10. dl,dt,dd：当页面中出现第一行为类似标题/简述，然后下面为详细描述的内容时应该使用该标签，例如：1. 2. 什么是CSS? 3. CSS就是一种叫做样式表（stylesheet）的技术。也有的人称之为层叠样式表（Cascading Stylesheet）。 4. 什么是XHTML？ 5. XHTML是一个基于XML的置标语言，看起来与HTML有些想像，只有一些小的但重要的区别。可以这样看，XHTML就是一个扮演着类似 HTML的角色的XML。本质上说，XHTML是一个桥接（过渡）技术，结合了XML（有几分）的强大功能及HTML（大多数）的简单特性。 6. C #contentS #subcolM #maincolX #xcol这是纵向布局的XHTML结构，c-smx表示网页有三个纵栏, c-sm表示有两个纵栏, c-mx表示有两个纵栏其中一个是附属的, c-m表示一个纵栏。其中在三纵栏的布局需要分为两层 第一层是#subcol与#main第二层是#main中的#maincol与#xcol。自定义命名：根据w3c网站上给出的,最好是用意义命名比如：是重要的新闻高亮显示（像红色）有两种1. .redcolor:red 2. .important-newscolor:red 很显然第二种传达的意义更加明确,所以尽量不要用意义不明确的作为自己自定义的名字常用的CSS命名规则:头：header内容：content/container尾：footer导航：nav侧栏：sidebar栏目：column页面外围控制整体布局宽度：wrapper左右中：left right center登录条：loginbar标志：logo广告：banner页面主体：main热点：hot新闻：news下载：download子导航：subnav菜单：menu子菜单：submenu搜索：search友情链接：friendlink页脚：footer版权：copyright滚动：scroll内容：content标签页：tab文章列表：list提示信息：msg小技巧：tips栏目标题：title加入：joinus指南：guild服务：service注册：regsiter状态：status投票：vote合作伙伴：partner(二)注释的写法:/* Footer */内容区/* End Footer */(三)id的命名:(1)页面结构容器: container页头：header内容：content/container页面主体：main页尾：footer导航：nav侧栏：sidebar栏目：column页面外围控制整体布局宽度：wrapper左右中：left right center(2)导航导航：nav主导航：mainbav子导航：subnav顶导航：topnav边导航：sidebar左导航：leftsidebar右导航：rightsidebar菜单：menu子菜单：submenu标题: title摘要: summary(3)功能标志：logo广告：banner登陆：login登录条：loginbar注册：regsiter搜索：search功能区：shop标题：title加入：joinus 状态：status按钮：btn滚动：scroll标签页：tab文章列表：list提示信息：msg当前的: current小技巧：tips图标: icon注释：note指南：guild服务：service热点：hot新闻：news下载：download投票：vote合作伙伴：partner友情链接：link版权：copyright(四)class的命名:(1)颜色:使用颜色的名称或者16进制代码,如.red color: red; .f60 color: #f60; .ff8600 color: #ff8600; (2)字体大小,直接使用font+字体大小作为名称,如.font12px font-size: 12px; .font9pt font-size: 9pt; (3)对齐样式,使用对齐目标的英文名称,如.left float:left; .bottom float:bottom; (4)标题栏样式,使用类别+功能的方式命名,如.barnews .barproduct 注意事项:1.一律小写;2.尽量用英文;3.不加中杠和下划线;4.尽量不缩写，除非一看就明白的单词.主要的 master.css模块 module.css基本共用 base.css布局，版面 layout.css主题 themes.css专栏 columns.css文字 font