CSS命名规范整理
基于网易NEC修改后，整理的命名规范
单行写完一个选择器定义
便于选择器的寻找和阅读，也便于插入新选择器和编辑，便于模块等的识别。去除多余空格，使代码紧凑减少换行。
如果有嵌套定义，可以采取内部单行的形式。
分类的命名方法：使用单个字母+"-"为前缀
布局（grid）（.g-）；模块（module）（.m-）；元件（unit）（.u-）；功能（function）（.f-）；皮肤（skin）（.s-）；状态（.z-）。
相同语义的不同类命名
方法：直接加数字或字母区分即可（如：.m-list、.m-list2、.m-list3等，都是列表模块，但是是完全不一样的模块）。
模块和元件的扩展类的命名方法
当A、B、C、...它们类型相同且外形相似区别不大，那么就以它们中出现率最高的做成基类，其他做成基类的扩展。
方法：+“-”+数字或字母（如：.m-list的扩展类为.m-list-1、.m-list-2等）。
补充：基类自身可以独立使用（如：class="m-list"即可），扩展类必须基于基类使用（如：class="m-list m-list-2"）。
选择器等级
1吨 = 行内样式style。
100斤 = ID选择器。
1斤 = 类、伪类和属性选择器。
1克 = 类型选择器和伪元素选择器。
统一语义理解和命名
语义 命名
文档 doc
头部 head
主体 body
尾部 footer
主栏 main
主栏子容器 main-in
侧栏 aside
侧栏子容器 aside-in
盒容器 wrap/box
|
布局（.g-） |
|
|
语义 |
命名 |
|
文档 |
doc |
|
头部 |
head |
|
主体 |
body |
|
尾部 |
footer |
|
主栏 |
main |
|
主栏子容器 |
main-in |
|
侧栏 |
aside |
|
侧栏子容器 |
aside-in |
|
盒容器 |
wrap/box |
|
模块（.m-）、元件（.u-） |
|
|
语义 |
命名 |
|
导航 |
nav |
|
子导航 |
subnav |
|
面包屑 |
crumb |
|
菜单 |
menu |
|
选项卡 |
tab |
|
标题区 |
head/title |
|
内容区 |
body/content |
|
列表 |
list |
|
表格 |
table |
|
表单 |
form |
|
热点 |
hot |
|
排行 |
top |
|
登录 |
login |
|
标志 |
logo |
|
广告 |
advertise |
|
搜索 |
search |
|
幻灯 |
slide |
|
提示 |
tips |
|
帮助 |
help |
|
新闻 |
news |
|
下载 |
download |
|
注册 |
regist |
|
投票 |
vote |
|
版权 |
copyright |
|
结果 |
result |
|
标题 |
title |
|
按钮 |
button |
|
输入 |
input |
