深层次了解CSS中的UI伪类

伪类（Pseudo classes）是挑选符的螺栓，用来特定1个或与其有关的挑选符的情况。它们的方式是 selector:pseudo class { property: value; }，简易地用1个半角英文冒号（:）来分隔挑选符和伪类。

伪类能够分成两种：

    UI（ User Interface，客户页面）伪类会在 HTML 元素处在某个情况时（例如电脑鼠标
    指针坐落于连接上），为该元素运用 CSS 款式。

    构造化伪类会在标识中存在某种构造上的关联时（如某个元素是1组元素中的第
    1个或最终1个），为相应元素运用 CSS 款式。

UI伪类
连接伪类

对于连接的伪类1共有4个，由于连接自始至终会处在以下4种情况之1。

    Link
    Visited
    Hover
    Active

    提醒：因为这4个伪类的特指度同样，假如不依照这里列出的次序应用它们，访问器将会不容易显示信息预期实际效果。便捷记忆力：LoVe? HA! 大写字母便是每一个伪类的头1个字母。

    提醒：1个冒号（ : ）表明伪类，两个冒号（ :: ）表明 CSS3 新增的伪元素。

focus伪类

表单中的文字字段在客户点击它时会得到聚焦点，随后客户才可以在这其中键入标识符。
比如：input:focus {border:1px solid blue;}
上面1行编码会在光标坐落于 input 字段中时，为该字段加上1个蓝色边框。这样可让客户确立地了解键入的标识符会出現在哪儿里。
target伪类

假如客户点一下1个指向网页页面中别的元素的连接，则那个元素便是总体目标（ target），能够
用:target 伪类选定它。
比如：针对这个连接：<a href="#more_info">More Information</a>
坐落于网页页面的其它地区、ID 为 more_info 的那个元素便是总体目标。
假定该元素为这样：<h2 id="more_info">This is the information you are looking for.</h2>
那末，CSS标准：#more_info:target {background:#eee}
会在客户点击连接转为 ID 为 more_info 的元素时，为该元素加上灰色情况。

    维基百科在其引用广州中山大学量应用了:target 伪类。维基百科的引用连接便是文章正文里那些
    不起眼的数据连接。引用自身则坐落于长长的网页页面的最正下方。假如沒有:target 运用的
    突显显示信息，很难了解你点一下的连接对应着1大堆引用中的哪个。

构造化伪类

构造化伪类能够依据标识的构造运用款式，例如依据某元素的父元素或前面的同胞元素是甚么。
first-child和:last-child

文件格式：

示例：

文件格式：

示例：

表明：e 表明元素名，n 表明1个标值（还可以应用 odd 或 even）