1、css 起名规范专栏：column元素：element页头：header登录条：loginbar标志：logo侧栏：sidebar广告：banner导航：nav子导航：subnav菜单：menu子菜单：submenu搜索：search滚动：scroll页面主体：main内容：content标签页：tab文章列表：list提示信息：msg小技巧：tips栏目标题：title加入：joinus指南：guide服务：service热点：hot新闻：news下载：download注册：register状态：status按钮：btn投票：vote合作伙伴：partner友情链接：friendlink页脚
2、：footer版权：copyright外围 wrap列一 column-one列二 column-two页面外围控制整体布局宽度：wrapper左右中：left right center-以上结构可以组合使用，例如：左列标题 lefttitle；底部导航 footernav 书写原则是： 1.一律小写； 2.尽量用英文； 3.不加中杠和下划线； 4.尽量不缩写，除非一看就明白的单词。命名全部使用小写字母，如果需要多个单词，单词间使用“-”分隔，比如user-list-css 书写规范一、 基本书写规范 1、所有的 CSS 的尽量采用外部调用书写时重定义的最先，伪类其次，自定义最后（其中 a:l
3、ink a:visited a:hover a:actived 要按照顺序写）便于自己和他人阅读。为了保证不同浏览器上字号保持一致，字号建议用点数 pt 和像素 px 来定义，pt 一般使用中文宋体的 9pt 和 11pt，px 一般使用中文宋体 12pt 和14.7px 这是经过优化的字号，黑体字或者宋体字加粗时，一般选用 11pt 和14.7px 的字号比较合适。2、CSS 推荐模板:为了保证浏览器的兼容性，必须设置页面背景3、其中注释写法，例：/*header begin!*/二、CSS 命名参考1、常用的 CSS 命名规则：头：header内容：content/container尾：f
4、ooter导航：nav侧栏：sidebar栏目：column2、直观命名当在设计 Web 页面以及需要对一个 div 进行标识的时候，最自然的想法就是使用可以描述元素所在页面位置的词汇来对其命名。这种方法使得类以及 id 的名称如下面所示：自上而下小组：top-panel横向：horizontal-nav左面：left-side中心-栏目：center-column右面：right-col这些是 CSS 以及 XHTML 类和 id 的有效命名方式。这些词汇简单并且能够使人顾名思义，因此满足了标识页面元素以及相应的 CSS 样式的需要。但问题是这样的名称同页面内容的特定表达方式相关联。这些命名
5、参考了某种特定页面布局中的页面元素位置，因此在这样的布局之外使用就会显得不合适甚至造成理解混乱。同时，这些命名没有涉及文档内容的结构。因此，下面给出了对 CSS 类以及 ID 命名更好的方法。3、结构化命名结构化的标记意味着表达方式/位置信息同内容的完全分离这其中包括出现在标记（markup）中的类和 id 名称。有标记的相关信息都是用来描述文档的结构而不是外观。这样的特点使得我们可以通过简单的改变 CSS 的方式来对不同外观格式下的内容（content）以及标记（markup）进行重用。当你理解这种方式时，很容易就可以发现采用页面位置来为类以及 id 命名的方式在处理如音频（audio）等外
6、观格式上显得非常不合适。因此，应当根据在文档中的使用目的而非出现位置来对类以及 id 进行结构化命名。可以按照如下所示的结构化方式来对类以及 id 名称命名：顶部抢眼部分：branding导航部分：main-nav主要内容部分：main-content这些名字同直观命名方式一样非常易懂，但他们描述了页面元素的作用而非位置。这使得代码更加符合使用纯粹的结构化标记（structural markup）的初衷，即开发人员可以在不改变标记的情况下对各种各样媒体下的显示格式进行处理。即使你不打算在其他的媒体上对 Web 页面进行格式修改，使用结构化命名方式还可以帮助你在日后的站点升级或重新设计中更为轻松
7、。例如，结构化命名避免了当一个 div 同 id right-column 移动到页面左边后所带来的混乱。对 div sidebar 的采用这样的命名方式就显得更加适当，因为无论它出现在页面的哪一边，这个名字仍然对开发人员来说直观易懂。4、惯例Andy Clarke 分析了 40 份由推崇标准化 Web 设计理念的开发人员所设计的 Web站点的源代码。尽管类以及 id 名称很不统一，但是还是发现了一些频繁出现的常用名称。这里给出了最常用类/id 名称的示例列表：headercontentnavsidebarfooter如果要查看完整的列表，可以看看最常见命名惯例表这些常见的类以及 id 名称是
8、否标志着一种标准的诞生或是普遍接受惯例的形成呢？尽管这是我所希望的，但我并不这么认为。我的确希望能够看见一整套对于我们每天都可以看到的常用页面元素的命名标准。同时，使用标准化的命名方式可以使得寻找页面元素以及对 Web 站点升级带来方便，尤其当需要在由不同开发人员在不同时间所开发站点中换来换去工作的时候。review:大的布局 div 可以以外观的方式命名(如 header,footer)，其他的我觉得还是应该以描述所含内容的标准来命名（如 menu，news）5、自定义命名：根据 w3c 网站上给出的,最好是用意义命名比如：是重要的新闻高亮显示（像红色）有两种.redcolor:red.important-newscolor:red很显然第二种传达的意义更加明确,所以尽量不要用意义不明确的作为自己自定义的名字三、CSS 样式书写顺序1、显示属性* display * list-style * position * float * clear2、自身属性* width * height * margin * padding * border * background3、文本属性* color * font * text-decoration * text-align* vertical-align * white-space * other text * content
