css 所有 class,开发中一些常用的css类名

命名时需要注意的点：

- 规则命名中，一律采用小写加中划线的方式，不允许使用大写字母或 _

- 命名避免使用中文拼音，应该采用更简明有语义的英文单词进行组合

- 命名注意缩写，但是不能盲目缩写，具体请参见常用的CSS命名规则

- 不允许通过1、2、3等序号进行命名

- 避免class与id重名

- id用于标识模块或页面的某一个父容器区域，名称必须唯一，不要随意新建id

- class用于标识某一个类型的对象，命名必须言简意赅。

- 尽可能提高代码模块的复用，样式尽量用组合的方式

常用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

关于css代码性能优化

- 合并margin、padding、border的-left/-top/-right/-bottom的设置，尽量使用短名称。

- 选择器应该在满足功能的基础上尽量简短，减少选择器嵌套，查询消耗。但是一定要避免覆盖全局样式设置。

- 注意选择器的性能，不要使用低性能的选择器。

- 禁止在css中使用*选择符。

- 除非必须，否则，一般有class或id的，不需要再写上元素对应的tag。

- 0后面不需要单位，比如0px可以省略成0，0.8px可以省略成.8px。

- 如果是16进制表示颜色，则颜色取值应该大写。

- 如果可以，颜色尽量用三位字符表示，例如#AABBCC写成#ABC 。

- 如果没有边框时，不要写成border:0，应该写成border:none 。

- 尽量避免使用AlphaImageLoader 。

- 在保持代码解耦的前提下，尽量合并重复的样式。

- background、font等可以缩写的属性，尽量使用缩写形式 。