仿站咨询QQ:2587483189

手机微信同号:15850888840

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

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

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

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

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

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


  1. <div id="a1"> <!--第1层--> 
  2.    <div id="a1a"> <!--第2层--> 
  3.      <div id="a1a1"> <!--第3层--> 
  4.       <div id="a1a1a"> <!--第4层--> 
  5.        <ul id="a1a1a1"> <!--第5层--> 
  6.         <li class="li01"><a>邮箱列表1</a></li> 

  7. 上一篇:PNG图片在IE6下背景不透明的解决方法
  8. 下一篇:LI中内容超过长度后以省略号显示的方法
来源:未知//所属分类: 仿站DIV+CSS /更新时间:2016-10-19
相关仿站教程