css伪类和伪类选择器 – CSS高级教程 _css伪类选择器

【css伪类和伪类选择器 – CSS高级教程】上一章CSS高级教程请查看：css元素对齐属性
CSS伪类选择器根据附加条件(不一定由文档树定义)匹配组件。
什么是伪类？CSS伪类允许你风格元素的动态状态如徘徊、活跃和集中状态,以及文档树中存在的元素,但不能有针对性的通过使用其他选择器在不添加任何id或类,例如,针对第一个或最后的子元素。
伪类以冒号(:)开头，其语法如下：

selector:pseudo-class { property: value; }

下面描述最常用的伪类。
锚伪类使用锚伪类链接可以显示在不同的方式：
这些伪类允许你将未访问的链接与已访问的链接区别开来。最常见的样式技术是从访问过的链接中删除下划线。

a:link { color: blue; } a:visited { text-decoration: none; }

有些锚伪类是动态的——它们是作为用户与文档交互的结果而应用的，比如悬停、聚焦等。

a:hover { color: red; } a:active { color: gray; } a:focus { color: yellow; }

这些伪类根据用户操作改变了链接的呈现方式。

:hover当用户将光标放在元素上但不选择它时，将应用hover。
:active应用当元素被激活或点击。
:focus当元素有键盘焦点时应用焦点。

注意:要使这些伪类完美地工作，你必须以正确的顺序定义它们:link、:visited、:hover、:active、:focus。
:first-child伪类:first-child伪类匹配的元素是其他元素的第一个子元素。在下面的例子中，选择器ol li:first-child选择一个有序列表的第一个列表项，并删除它的顶部边框。

ol li:first-child { border-top: none; }

注意：要使::first-child能工作在Internet Explorer 8和更早的版本，一个< !DOCTYPE> 必须在文档的顶部声明。
::last-child伪类last-child伪类匹配的元素是其他元素的最后一个子元素。在下面的示例中，选择器ul li:last-child从无序列表中选择最后一个列表项，并从中删除右边框。

ul li:last-child { border-right: none; }

注意：last-child选择器在Internet Explorer 8和更早的版本中不起作用，但支持在Internet Explorer 9和以上。
:nth-child伪类CSS3引入了一个新的:nth-child伪类，它允许你针对给定父元素的一个或多个特定的子元素。这个选择器的基本语法可以是:nth-child(N)，其中N是一个参数，它可以是一个数字，一个关键字(偶数或奇数)，或者xn+y的表达式，其中x和y是整数(如1n, 2n, 2n+1，…)。

table tr:nth-child(2n) td { background: #eee; }

上面示例中的样式规则只是突出显示备用表行，而不向< table> 元素添加任何id或类。
提示：CSS的:nth-child(N)选择器在需要选择文档树中以特定间隔或模式出现的元素(比如在偶数或奇数位置)的情况下非常有用。
:lang伪类语言伪类:lang允许根据特定标记的语言设置构造选择器，下面示例中的:lang伪类为显式给定语言值no的< q> 元素定义了引号。