什么是网页伪类选择器

  • 2018-08-05 00:39:02
  • 阅读次数:
  • 作者:盈岚科技小编
  • 来源:http://www.lyjtt.cn

伪类选择器和伪元素选择器才真正有些意思。利用这些选择器,可以为网页中不一定具体存在的结构指定样式,或者为某些元素(甚至是文档本身)的状态所指示的幻像类指定样式。换句话说,会根据另外某种条件而非文档结构向文档中的某些部分应用样式,而且无法通过研究文档的标记准确地推断出采用何种方式应用样式。

听上去好像是在随机地应用样式,不过并非如此。实际上,这里是根据某种无法提前预测的暂时条件来应用样式,不过,什么情况下将出现样式实际上是明确定义的。可以这样想:在一个赛事中,只要主场球队得分,观众就会欢呼,在比赛中你并不知道球队什么时候会得分,但是一旦得分,不出所料,观众就会大声欢呼。尽管无法预测哪个时刻出现前因,但并不影响对后果的预测。

先来分析伪类选择器,因为网页浏览器对伪类选择器提供了更好的支持,相应地使用更广泛。

我们来考虑锚元素(a),在HTML网页和XHTML网页中,锚元素会建立从一个网页文档到另一个网页文档的链接。这样描述锚固然不错,不过有些锚指示的是已经访问过的页面,而另外一些则指示尚未访问的页面。只是看HTML标记是无法区别二者的差别的,因为在标记中所有锚看上去都一样。要想区别哪些链接已经访问过,唯一的办法就是将文档中的链接与用户的浏览历史相比较。所以,实际上有两种基本的锚类型:已访问的和未访问的。这些类型称为伪类(pseudo-class),使用这些伪类的选择器则称为伪类选择器(pseudo- class selector)。

为了更好地理解这些类和选择器,下面来考虑浏览器如何处理链接。Mosaic协定指定未访问页面的链接为蓝色,已访问页面的链接为红色(在以前的浏览器中,如Internet Explorer,已访问链接可能不是红色而是紫色)。所以,如果可以向锚中插入类,使已经访问过的锚有一个类(如“visited”),就可以写如下样式来使这些锚变成红色:

a.visited {color: red;}

<a href="http://www.w3.org/" class="visited">W3C Web site</a>

不过,这种方法要求每次访问一个新页面时都要修改锚的类,这种做法有些傻。与此不同,CSS定义了伪类,使已访问页面的锚就好像已经有一个“visited”类一样:

a:visited {color: red;}

现在,指向已访问页面的锚都会是红色,甚至你不必为任何锚增加class属性。注意规则中的冒号(:)。分隔a和visited的冒号是伪类或伪元素的“名片”。所有伪类和伪元素关键字前面都有一个冒号。


当前文章标题:什么是网页伪类选择器

当前URL:http://www.lyjtt.cn/news/wzzz/what-pseudo-class.html

上一篇:网页css的类选择器和id选择器

下一篇:什么是链接伪类

网站建设、网络营销咨询专线:181-8386-5875(点击可一键拨号)