CSS命名的规范

一、命名规则说明

1）、所有的命名最好都小写

2）、属性的值一定要用双引号("")括起来，且一定要有值如class="divcss5",id="divcss5"

3）、每个标签都要有开始和结束，且要有正确的层次，排版有规律工整

4）、空元素要有结束的tag或于开始的tag后加上"/"

5）、表现与结构完全分离，代码中不涉及任何的表现元素，如style、font、bgColor、border等

6）、<h1>到<h5>的定义，应遵循从大到小的原则，体现文档的结构，并有利于搜索引擎的查询。

7）、给每一个表格和表单加上一个唯一的、结构标记id

8）、给图片加上alt标签

9）、尽量使用英文命名原则

10）、尽量不缩写，除非一看就明白的单词

 

 

二、命名时需要注意的点

规则命名中，一律采用小写加中划线的方式，不允许使用大写字母或 _
命名避免使用中文拼音，应该采用更简明有语义的英文单词进行组合
命名注意缩写，但是不能盲目缩写，具体请参见常用的CSS命名规则
不允许通过1、2、3等序号进行命名
避免class与id重名
id用于标识模块或页面的某一个父容器区域，名称必须唯一，不要随意新建id
class用于标识某一个类型的对象，命名必须言简意赅。
尽可能提高代码模块的复用，样式尽量用组合的方式
规则名称中不应该包含颜色（red/blue）、定位（left/right）等与具体显示效果相关的信息。应该用意义命名，而不是样式显示结果命名。
 

 

三、DIV+CSS命名参考表

CSS样式命名	说明
网页公共命名
#wrapper	页面外围控制整体布局宽度
#container或#content	容器,用于最外层
#layout	布局
#head, #header	页头部分
#foot, #footer	页脚部分
#nav	主导航
#subnav	二级导航
#menu	菜单
#submenu	子菜单
#sideBar	侧栏
#sidebar_a, #sidebar_b	左边栏或右边栏
#main	页面主体
#tag	标签
#msg #message	提示信息
#tips	小技巧
#vote	投票
#friendlink	友情连接
#title	标题
#summary	摘要
#loginbar	登录条
#searchInput	搜索输入框
#hot	热门热点
#search	搜索

 

 

 

参考资料：    CSS命名规范      http://www.studyofnet.com/news/324.html