随着项目的进展,站点CSS样式表日常组织中的一些问题如下:
- 1.CSS样式表混乱。原有的代码不敢随便修改或删除,因为自己也不知道改了以后会给现有项目造成什么影响。
- 2.代码编写没有规范,导致同一样式重复定义或上下不一致。
- 3.css导致的一些其它问题。
对应解决方案:
- 一.确认项目文件结构与文件命名规则,路径:

如图,公用图片文件放在根目录images下,栏目用到的图片放在当前栏目images下;链接使用站点相对路径。- 二.CSS文件结构:
- /* CSS Document */
- @import 公用样式.css
- @import 链接样式.css
- @import 布局样式.css
- @import 设计师A.css
- @import 设计师B.css
- 三.CSS样式定义规则:
- 1.不以下划线或数字开头。
- 2.命名使用大小写“驼峰”式书写如:帮助页面公用布局区域.helpConBox;e家内容块#eJiaBox或下划线如help_con_box。
- 3.命名尽量贴切内容。
- 4.为每个功能块添加ID如:登陆区域id="loginA",若有公用样式则id="loginA" class="gongYongBoxA";确保将每一个功能块复制或剪切到新建其它页面而样式不会丢失。(可避免在利用CSS继承性定义样式时出现的上述情况)。
- 4.在有多个设计师制作页面的时候给样式加添加前缀,避免出现样式重复定义。
- 四.CSS样式表头处建立索引:明了css内容目录以及方便查找
-

- 五.注释规则:
- 1.当使用XHTML+CSS布局时合理使用注释
,后者可能会引发IE-BUG不推荐使用。 - 2.css里的中文注释可能会导航部分样式失效,尽可能在上测试或上传时清除注释,仅在备份文件中保留。
- 六.布局规则:
- 1.布局尽量语义化,合理使用html标签。
- 2.在结构与扩展性之间找平衡,通过修改CSS样式达到更多样式风格的实现。
- 3.通用样式,布局样式等整体布局风格相关的模块先确定并制作出来。
- 七.浏览器兼容:
- 指定兼容浏览器及其版本。