DIV+CSS命名规范

Div+CSS命名规范

1、页面结构

容器: container

页头：header

内容：content/container

页面主体：main

页尾：footer

导航：nav

侧栏：sidebar

栏目：column

左右中：left right center

2、导航

导航：nav

主导航：mainnav

子导航：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; } 　　.ff6600 { color: #ff6600; }

2、字体大小，直接使用’font+字体大小’作为名称，如

.font12px { font-size: 12px; } 　　.font9pt {font-size: 9pt; }

3、对齐样式，使用对齐目标的英文名称，如

.left { float:left; } 　　.bottom { float:bottom; }

4、标题栏样式,使用‘类别+功能’的方式命名，如

.barnews { } 　　.barproduct { }

常用的CSS文件规范命名：
　　
主要的 master.css　　
模块 module.css　　
基本共用 base.css 　　
布局，版面layout.css　　
主题 themes.css　　
专栏 columns.css 　　
文字 font.css　　
表单 forms.css　　
补丁 mend.css　　
打印print.css

注意事项：

1.一律小写，不要驼峰；

2.尽量用英文；

3.尽量不加中杠和下划线；

4.尽量不缩写，除非一看就明白的单词；