在写页面时,对于标签的命名总是很头疼,特别是对于可复用以及后期可能会修改的标签命名,今天特地查找了一些资料,总结了class命名的几条规范:
1、命名可以包含英文、数字以及 - ,但是不能以数字或者是 - 后加数字开头(无法调用)。
2、命名应该以功能命名,不以表现命名。这点对后期修改有很大帮助,例如对于侧边栏,命名为“boxLeft”,似乎也没有问题,但是后期可能侧边栏修改到页面右侧,这时可能就会导致混乱。命名为“sideBar”则会避免此类问题。
常用功能命名如下:
.wrapper 用于最外层的外套
.content/.container 容器
.head/.header 头部
.foot/.footer 页脚
.menu 菜单
.submenu 子菜单
.sideBar 侧栏
.main 主体
.title 标题
.copyright 版权
.joinus 加入我们
.parther 合作伙伴
.siteinfo 网站信息
.siteinfoLegal 法律声明
3、要预防命名冲突,可以采用功能模块名+结构名的方式命名。例如:热点问题功能模块的头部,可以命名为“hot-head”
4、命名为ID还是class,一般采用的原则是主要的、特殊的、最外层的采用ID命名。