CSS 并不总是容易处理。 在你的能力和经验不够的时候,CSS编程会成为一个噩梦,特别是你不确定为页面元素中选择哪种选择器的时候。使用一个不常见的CSS属性以实现更好的语义化,没有比这个方法更好用的更简单的的实现减少代码复杂度的了。
1、首先重置CSS样式 “你可能经常使用某属性的默认值而不是专门为该属性设置一个值。有的开发者倾向于设置Global white space reset5 ,在样式表的顶部将所有元素的margin和padding都设置为0
2、编写一个辅助CSS类库此类库用于辅助调试,但是要避免用于已发布的版本中(将标记层与表现层分离)。 你可以使用如下多种类名(即 ...)来调试标记层。
3、使容器保持最小化。 “将你的文档从结构臃肿中拯救出来。新手开发者倾向于使用很多类似于表格单元格的DIV来实现布局。实际上许多其他结构元素都可以用来实现布局。不要使用过多的DIV。在使用过多的包装(DIV)去实现效果前考虑所有的选择,会发现使用一点漂亮的CSS也能达到相同的预期效果。”
4、使CSS hack保持最少 “除非遇到了已知的已公布的bug,否则不要使用hack。这是一个很重要的要点,因为我也经常看到hack被用来处理一些压根儿就没有问题的东西。如果你发现需要找一个hack来处理某个设计中的问题,那么首先你需要做一些调查(Google这里能派上用场),然后试着鉴定一下你遇到的这个问题(是否真的需要hack来处理)。
5、在敏捷开发中使用CSS常量 “常量的概念-通过你的代码可以使用的固定值是有用的。有一种应对CSS中缺乏常量的方法是在CSS文件顶部注释中添加一些相关的定义来定义‘常量’。这种方法常见的一种应用是‘创建颜色词汇表’。这种方法可以让你对网站中使用的颜色有一个快速的参考,避免在使用颜色时失误,并且一旦你需要修改颜色,你可以马上利用这个速查表进行搜索和替换。” [
6、使用一个通用的命名系统。 在寻找bug或者更新文件时,如果你有一个id和class的命名系统会节省很多时间。特别是大型的CSS文件,如果命名不规范,很快就会导致巨大的混乱。我推荐使用parent_child模式。
7、根据class和id的语义适当的为他们命名。 “我们倾向于避免表明表象方面的命名。否则,如果我们命名一些右列的东西,完全可能改变CSS并且“右列”最终在页面的左边显示。这在未来可能导致混乱,所以最好避免这种表象的命名方案。
8、分类常见的CSS声明选择器。 “分类选择器。当一些元素类型,类或者id共享一些属性时,你可以分类选择器避免在有些时候设置了相同的属性。这将会节省潜在的大量空间。
9、将你可能会重复使用很多次某个唯一的属性单独分离出来。 “如果你发现你使用某个唯一的属性很多次,为了使你不再一遍又一遍的重复不仿将其分离出来,而且也使你能够改变网站中所有使用过此属性的部分的显示。”
10、尽量将id和class的命名持平文档树 尽可能的使用 上下文选择器25 。不要担心这样做会使选择器变得冗长。长的选择器会使css文档更容易阅读,也减少了发展成 classitis 或者 divitis26的可能。
|
|