正 文

如何正确的使用 id 和 class


七度空间 2007-8-8 2:28:14 免费5位qq号码 免费Q币

例子举了这么多,你可看得出,仅仅因为“只出现一次的元素”这个理由,就决定给它用id而不是class,这是绝对行不通的。因为你几乎很难判断某个元素是不是一定只出现一次。但是,这样的分析会得出一个可怕的结论:所有的样式都应该用class。

对此,我其实并不怀疑。事实上,以我的看法,95%以上的样式,都应该通过class而不是id来设置。或者说,除非是一些很细微很特殊的位置,可以使用id来设置样式,其他的样式都应该用class来设置。这个结论似乎和WaSP的圣经书《网页重构》里讲的矛盾,因为他老人家是专门批评了所谓的 classitis(class麻疹,见该书148页)。但是很抱歉,铁证如山的事实底下,我不得不否定他那句“热爱id”(见该书150页)。

当然,我很希望我是错的,毕竟背叛经典是一件很让人不舒服的事情。所以欢迎大家来讨论,指出我的错误。更重要的是,对于我举出的哪些尴尬的例子给出一个更好的解决方案。

总结:尽量用class而不是id来控制样式的理由:

  1. 可维护性。你不能保证你用id的元素只在页面中出现一次,即使在网页设计初稿中确实是只有一次。
  2. id可能被Ajax程序员使用。如果页面要用ajax的话,某些元素的id值应该由Ajax程序员而不是页面设计师来决定,至少应该是双方共同商定。那么,你怎么能放心你的id值既用来设置CSS样式,又用来供JS调用呢?
  3. 同一个元素可以定义多个class,却只能有一个id。你明白我的意思了吧?
  4. id的优先级高于class。所以如果对于某个特定的元素,我们想赋予特定的样式,可以给它加id。但是反过来,如果我们一开始就是用id,你去加class是没有效果的啦。

最后,关于Zeldman老先生讲的classitis。我的理解是不要为了某个特定的样式置顶一个特定的class。尽量创造一些能够重复使用的 class。而id由于不能重复,反而才容易造成iditis呢。到时候我们的网站会出现search-box-top, search-box-bottom,甚至search-box-under-the-header-but-above-the-main-menu,哈哈。更可怕的是,它们的属性定义其实都一模一样。

2页,页码:[1] [2] 


上一篇:Fireworks CS3切片工具的使用
没有了
如何正确的使用 id 和 class 作者:wheatlee 来源:蓝色理想
收藏此页】【打印】【关闭
站 内 搜 索
 
特 别 推 荐
热 点 导 读