CSS样式命名之“逻辑块命名法”

 当我们依照结构与内容分离的思想去切出一个符合标准的网页时，每个人可能都有自己的样式命名习惯。

但这种不同的习惯一方面未必系统，即往往随意性比较强，容易重名造成麻烦，管理也很不方便，甚至有时候会为起个名字而发愁(呵呵，夸大了点^0^);另一方面，用在一个团队中，也会由于混乱性，而带来团队效率的降低。

再者，目前的样式命名基本上都用“英文”，极少有人用中文(来回切换输入法也很麻烦的)。如果有些人习惯于全套英文式命名的话，会对团队里英文不佳者造成一定的麻烦。因为他们要为起名去查字典，而且他们查到的单词还不一定可以准确形容被命名的块逻辑结构。比如曾经有人建议使用面包屑(crumb)来作为导航命名——故事来自两个迷路的孩子沿着撒下的面包屑找回家的英文小说典故。但是，这作为个性还行，用在团队中却绝不可取。认知不同，别人说不定也有自己的典故。

此外，还有几个忌讳之处：比如，不要出现表示方向的命名，例如“left、right、top、bottom”等等。因为一旦如果我们需要左边放右边，那么这些命名将完全失去作用，反而成为了混淆我们认知的垃圾。

下面我提出一种命名系统设想(逻辑块命名法)供大家参考：

<div id="a1">　<!--第１层--> 
　　　<div id="a1a">　<!--第２层--> 
　　　　 <div id="a1a1">　<!--第３层--> 
　　　　　 <div id="a1a1a">　<!--第４层--> 
　　　　　　 <ul id="a1a1a1">　<!--第５层--> 
　　　　　　　 <li class="li01"><a>邮箱列表１</a></li>　


     
上一篇：PNG图片在IE6下背景不透明的解决方法 
     
下一篇：LI中内容超过长度后以省略号显示的方法