室内设计培训
平面设计培训
部落窝教育
网站首页 >> 设计在线 >> 文章内容

CSS选择器种类和id、class的适用范围

[日期:2010-03-06]   来源:主流技术阁  作者:主流技术阁   阅读:2263[字体: ]

1、CSS选择器的种类

  选择器(selector)是CSS样式中一个很重要的概念,所有HTML语言中的标记都是通过不同的CSS选择器进行控制的。我们只需要通过选择器对不同的HTML标签进行控制,并赋予各种样式声明,即可实现各种效果。

  CSS选择器包括:标记选择器,类别选择器(.class),ID选择器(#id)三种。

  技巧:可以在html选择器后面使用一个选择器来指定特殊HTML元素,比如p.jam{值}将作用到带有'jam'class属性的段落。

  在CSS里,使用点号(.)创建class选择器,使用hash符号(#)创建ID选择器。


2、ID和class的适用范围


  ID和class就页面效果而言,两个的视觉效果几乎无差别,W3C对于ID与CLASS的设定是ID具有唯一性,CLASS具有普遍性,所以一个页面同一个ID只能使用一次,而class可以无限制使用。

  在实际使用中,单一的元素或需要程序、JS控制的东西,需要用id定义;重复使用的元素、类别,用class定义。

  ID需要具有唯一性,并且尽量在外围使用。而CLASS具有可重复性,并且尽量在结构内部使用。这样做的好处是有利于网站代码的后期维护与修改。正式是因为ID是不能重复的,所以在XHTML的结构中,大结构一定是用ID。比如标志、导航、主体内容、版权,规范命名为#logo , #nav , #content , #copyright。

  类别选择器和ID选择器的简单示例:
  <div id="style1">
  <div class="style2">
  style1 只能定义为 #style1{.....} 这就是ID选择器
  style2 只能定义为 .style2{.....} 这就是类别选择器
  总结:一个页面上所有控件ID不能重复且只能使用一次,但class可以被多个 html控件所套用,无限次使用。

主流技术阁PS,CDR,213班 分享到: QQ空间 新浪微博 腾讯微博 人人网
photoshop教程
Photoshop教程
平面设计教程
Photoshop教程