学做网站时什么是网站CCS伪类？_做网站_鸿运通

网站建设技术团队

学做网站时什么是网站CCS伪类？

日期 : 2014-03-12

学做网站时什么是网站CCS伪类？

除传统样式类之外，CSS标准清空定义了伪类，它允许为特定的标签状态（states）定义显示样式，诸如在用户选择超链接时改变显示样式。创建伪类的方法和常规类相似，但有两个显著的不同之处：它们在连接到标签名时使用的是冒号而不是句点，而且它们有预先定义好的名称，而不能随便给它们取个名字。共有7种伪类，其中3类明确地与标签相关联。

超链接伪类

与CSS兼容的浏览器可以区分用标签创建的超链接的三种特殊状态:未访问状态、正在访问状态。浏览器可以改变标签内容的外观来表明它的状态，例如使用下划线或颜色。可以通过伪类将样式定义为a:link(未访问)、a:active(正被访问)和a:visited(访问过的)，来控制这些状态的显示方式。

:link伪类控制未被用户选择以及还没有访问过的的链接的外观国。:active伪类定义目前正被用户择和正被浏览器访问的链接的外观。visited伪类定义已被用户访问过的链接。

要完整地定义标签的所有这三种状态，可以用如下代码：

a:link{color: blue}

a:active{color: red;font-weight: bold;}

a:visited{color: green}

在上面的示例中，能够识别样式浏览器应该用蓝色显示未访问过的逻接。当用户选择了某个链接时，浏览器将把其文字颜色变为红色，并变成粗体。一旦访问了某个链接，该链接将恢复为绿色文字。

交互作用伪类

css标准定义了两种新的伪类，它们和:active一样与用户动作相关，它们通知交互代理（如浏览器）在用户与元素交互时该如何显示被影响的元素。换句话说，hover和focus这两种伪类是动态的。

例如，将鼠标拖到文档上某个链接上时，浏览器可以改变鼠标指针的图标。与悬停（hovering）相关联的样式，必须是只有当鼠标停留在元素上时才起作用的样式。例如，如果在我们标例中的超链接样式规则列表中添加:hover伪类:

a:hover{color: yellow}

与未访问的链接相关的文字都将显示为蓝色，但在用鼠标指向它时会变成黄色，访问它时变成红色，访问过后则会变成绿色。

同样，:focus伪类允许我们在元素变成专注的对象时改变其样式。当你tab键切换到某元素，或者单击它，或者单击它，或者根据不同的浏览器把光标移向它时，该元素就会成为焦点目标。不管如何使元素成为焦点，与焦点伪类相关的样式规则只在元素是焦点时才会应用。

嵌套和语言伪类

当某元素是包含元素的第一个子元素时（亦称为“child”，也就是“子”），CSS2的:first-child伪类允许我们指定要使用的颜色。例如，当某个段落是某部分的第一个元还给时，可以应用下列规则;而且不能有插入元素（注意，特殊的大于号语法将第一个子元素与其父元素关联了起来）：

div > P:first-child{font-style: italic;};

因此，下列HTMl代码块中的第一段会被与CSS兼容的浏览器以斜体显示，因为它是这个部分的第一个子元素。相反，第二段会在一个二级标题后出现，这个二级标题是第二个的第一个子元素。因此本例的第二个段落显示为纯文本，为它不是这个部分的第一个子元素：

深圳鸿运通网络

建站学院

深圳鸿运通网络建站学院提供分享做网站知识

最后，CSS2标准还定义了一种新的伪类，允许我们根据其语言来选择元素。例如，在一个

标签中可以包括lang=fr属性，告诉浏览器这个部分包含的是法语（French）文字。浏览器会特殊对待这个文本。还可以把伪类:lang强加到某个特殊样式中。例如：

div:lang（it）｛font-family:Roman｝

这表示文档中包含意大利（Italy）文的部分应该使用罗马（Roman）字体系列。这种上做法非常合适，你不觉得吗？注意，应该在紧随lang关键字后的圆括号内指定语言。与lang属性相同，这里对伪类:lang也要使用双字母ISO标准代码。现在的浏览器都不支持网站中出现:lang、first-child或:focus伪类。但是，目前流行的所有浏览器都支持网站超链接标签()的:link、active、:hover和:visited伪类。尽管做网站时:active也可用于其它元素，但没有浏览器支持标签以外的应用。