1.2.2 通用选择器
通用选择器可能是所有选择器中最强大却最少使用的。通用选择器的作用就像是通配符,它匹配所有可用元素。与其他语言中的通配符一样,通用选择器由一个星号表示。通用选择器一般用来对页面上的所有元素应用样式。例如,可以使用以下规则删除每个元素上默认的浏览器填充和空白边:

在与其他选择器结合使用时,通用选择器可以用来对特定元素的所有后代应用样式,或者跳过一级后代。在本章稍后将看到这么做的实际效果。
1.2.3 高级选择器
CSS 2有许多其他有用的选择器。不幸的是,虽然Firefox和Safari等现代浏览器支持这些高级选择器,但是IE 6和更低版本不支持。好在在创建CSS时考虑到了向后兼容性。如果浏览器不理解某个选择器,那么它会忽略整个规则。因此,可以在现代浏览器中应用样式和易用性方面的改进,同时不必担心它在老式浏览器中造成问题。但是要记住,在对于站点功能很重要的任何元素上应该避免使用这些高级选择器。
1. 子选择器和相邻同胞选择器
这些高级选择器中的第一个是子选择器。后代选择器选择一个元素的所有后代,而子选择器只选择元素的直接后代,即子元素。在下面的示例中,外层列表中的列表项显示一个定制的图标,而嵌套列表中的列表项不受影响:

在IE 6和更低版本中,可以使用通用选择器模拟子选择器的效果。为此,先在所有后代上应用你希望子元素具有的样式。然后,使用通用选择器覆盖子元素的后代上的样式。所以,要实现与前面的子选择器示例相同的效果,可以这样做:

还可能希望根据一个元素与另一个元素的相邻关系对它应用样式。相邻同胞选择器可用于定位同一个父元素下某个元素之后的元素。可以使用相邻同胞选择器让顶级标题后面的第一个段落以粗体显示,同时不影响其他段落:

2. 属性选择器
顾名思义,属性选择器可以根据某个属性是否存在或属性的值来寻找元素。因此能够实现某些非常有意思和强大的效果。
例如,当鼠标停留在具有title属性的元素上时,大多数浏览器会显示一个工具提示。可以使用这种特性解释某些内容(比如缩写词)的含义:

但是,如果不把鼠标停留在这个元素上,那么没有任何迹象能够表明存在这一额外信息。为了解决这个问题,可以使用属性选择器对具有title属性的abbr元素应用与其他元素不同的样式——在下面的示例中,在它们下面加上点。还可以在鼠标停留在这个元素上时将鼠标指针改为问号,表示这个元素与众不同,从而提供更多的上下文相关信息。

除了根据某个属性是否存在对元素应用样式之外,还可以根据属性值应用样式。例如,使用rel属性值nofollow链接的站点无法从Google获得评级收益(ranking benefit)。以下规则在这种链接旁边显示一个图像,以此表示不推荐这个目标站点:

由于IE 6和更低版本不支持属性选择器,有一种更聪明的使用属性选择器的方法。可以对IE应用一种样式,对更符合标准的浏览器应用另一种样式。例如,IE在显示1像素的点边界方面有问题,所以可以将点边界显示为虚线。可以使用属性选择器将点边界只应用于能够正确地表现它的浏览器。这需要寻找class属性而不是使用类选择器。

一些属性可以有多个值,值之间用空格分隔。属性选择器允许根据属性值之一寻找元素。例如,一些开发人员建议在链接的属性中使用预定义的关键字来定义站点拥有者与其他人的关系。可以利用这一信息将一个图像应用于在rel属性中包含关键字friend的任何链接。

使用具有friend值的rel属性称为XHTML Friends Network(简称为XFN),这是最近开发的几种新的“微格式”之一。可以在http://gmpg.org/xfn/了解关于XFN的更多信息,可以在http://microformats.org了解微格式的概念。
使用具有friend值的rel属性称为XHTML Friends Network(简称为XFN),这是最近开发的几种新的“微格式”之一。可以在http://gmpg.org/xfn/了解关于XFN的更多信息,可以在http://microformats.org了解微格式的概念。
一旦这些高级的CSS 2选择器得到广泛的支持,在代码中添加额外的div或类的需求就会大大减少。
购买《精通CSS:高级Web标准解决方案》:http://shop.csai.cn/itbook/itbookinfo.asp?lbbh=10014414