HTML+CSS编写规范

在任何一个项目或者系统开发之前都需要定制一个开发约定和规则，这样有利于项目的整体风格统一、代码维护和扩展。由于Web项目开发的分散性、独立性、整合的交互性等，所以定制一套完整的约定和规则显得尤为重要。

第一节 CSS样式文件的命名

建立样式表文件时，分类编写样式到下列样式表文件中，并统一放在【CSS】文件夹里：

主要	main.css	文字样式	font.css
表格	table.css	主题	themes.css
打印	print.css	补丁	mend.css

在项目初期，会把不同类别的样式放于不同的CSS文件，是为了CSS编写和调试的方便，在项目后期会为了网站性能上的考虑会整合不同的CSS文件到一个CSS文件，必要时可压缩。

第二节 CSS选择符的命名

所有选择符必须有小写英文字母或“_”下划线组成，样式名必须是表示该样式的大概含义（禁止出现如Div1、div2、Style1……），参考后面的“样式命名参考”。对CSS选择器的使用只允许派生选择器、类选择器和属性选择器，以及它们的组合使用，严禁使用ID选择器（ID是用于JavaScript的编写）。

如：li span {…}td.fancy {…}input[type="text"]{…}

当定义的样式名比较复杂时用下划线把层次分开，比如：dcrm_logo{ …} dcrm_logo_ico{…}

第三节 图片的命名与书写

图片的命名原则小写英文字母名称放在头尾两部分，用“_”下划线隔开，头部表示此图片的大类性质例如广告、标志、菜单、按钮等等；尾部表示图片的概念。设计人员在PS中保存图片时，请使用“文件”à“存储为Web和设备所用的格式”。

广告	banner	标志	logo
链接的小图片	button	装饰图	pic
标题的图片	title
banner_sohu.png 、banner_sina.png、 menu_about_us.png、menu_job.png、 title_news.gif、 logo_police.gif、 logo_national.gif 、pic_people.jpg

第四节 CSS注释书写规范

4.1 提示和标签信息注释

这是注释最常用的途径，可以为自己或其他开发人员留下提示信息可以避免后期引起的不必要的困惑和麻烦。这种应用简洁性最为重要。

.search{ border:1px solid #fff; /*Border Color*/ }

注意：注释内容和前面样式语句间有3个空格，后面1个空格

4.2 修改样式注释（时间和相关人员）