更有趣的是伪类pseudo-class和伪元素pseudo-element选择符,至少在语法上讲是这样的。它们允许将样式应用于文档中不存在的结构上,或者是通过当前元素状态甚至是文档自身的状态而推断的某些东西上。换句话说,可以不依赖于文档结构,而且在不能简单地通过研究文档的标记来推断的情况下,将样式应用于文档的某个部分。
看起来好像我们是在随机地应用样式,其实并非如此。在这里,样式的应用是根据不能提前预测的即时条件而确定的。而且,对能够应用样式的情形都很好地进行了定义。这就好比是一场体育赛事,不管主队在什么时候得分,观众都会为之喝彩。用不着去关心它什么时候到来,只要适当的条件出现了,观众们就会像预期的那样为之喝彩。虽然不知道到底会在哪一刻(或哪一局,哪一节)主队会得分,但是这并不会影响观众的预期行为。
伪类选择符
首先我们来看看伪类选择符。由于它们得到浏览器的良好支持,所以也得到了广泛的应用。让我们借助一个实例来看看它们是怎样运作的。在讲到实质性的东西前我们会花掉一些时间,因此请耐心地跟我来吧。
考虑定位锚标记,它用来在一个文档和另一个文档间建立链接。当然,定位锚只是一种标记,但某些定位锚指向那些已经访问过的网页,而另外一些则指向还没有访问过的网页。而且这不是简单地查看HTML标记就能判断出来的,因为在标记里,所有的定位锚都一样。只有将文档中的链接同用户浏览器的历史记录结合起来,才能判断哪些是已访问过的,哪些还没有。因此,从某种意义上讲,有两种基本类型的定位锚标记:访问过的和未访问过的。实际上,它们都属于伪类,而且所使用的选择符被称作伪类选择符。
要明白其含义,先让我们来看一下浏览器是怎样处理链接的。Mosaic的常规作法是让未访问过的链接显示为蓝色,已访问过的链接显示为红色,这在后来的一些浏览器,如Internet Explorer中已被改成紫色了。如果要在定位锚中插入一个类,那么任何访问过的定位锚都应该有一个”已访问过的”类,这样就能使其变为红色:
A.visited {color:red;}
Ximicc
然而这样一种方法要在每次访问一个新网页时改变定位锚中的类,这就显得有些麻烦。取而代之的是,CSS定义的伪类可以使访问过的链接具有”已访问过的”类的特征。如下:
A:visited {color:red;}
就这么简单——任何指向已访问过的网页的定位锚都将是红色,而且不必为任何定位锚添加类属性。注意规则中的冒号。分隔A和”visited”的这个冒号被称作伪类或伪元素的标记符。所有伪类和伪元素关键字都是以一个冒号开头的。
下面是另一个例子:
A:visited {color:silver;}
W3C Web site
Ximicc
如下图所示,第一个定位锚指向未访问过的网页,其颜色为蓝色,而第二个定位锚是银色,因为在这之前,浏览器已经载入过这张网页: