Web前端开发简明教程
首页 > Web前端开发简明教程 > 7.3 伪类

7.3 伪类

2020-10-12 17:35:31 36 0

编辑 收藏

7.3 伪类

css伪类是用来添加一些选择器的特殊效果。伪类的语法为:

选择器:伪类名 {CSS属性:值;……CSS属性:值;}

如<a>伪类有:link、visited、hover和active,可以分别定义每个伪类的样式:

a:link {color:#FF0000; } /* 未访问的链接 */ a:visited {color:#00FF00; } /* 已访问的链接 */ a:hover {color:#FF00FF; } /* 鼠标划过链接 */ a:active {color:#0000FF; } /* 已选中的链接 */

这四个伪类定义了超链接未被访问、已被访问、鼠标移动到超链接和激活超链接时超链接的样式(注意:在CSS定义中,a:hover必须被置于a:link和a:visited之后才是有效的;a:active必须被置于a:hover之后才是有效的)。

伪类可以与CSS类配合使用:

CSS代码:a.red:visited {color:#FF0000; } HTML代码:< a class="red" href="css-syntax.html">CSS Syntax</a>

上面的代码定义应用了类“red”的超链接被访问后超链接的颜色为红色。除了这四个伪类,还有很多其他伪类,如“first-child”(选择元素的第一个子元素)“:nth-child(n)”(选择元素的第n个子元素)等伪类,本文不做过多介绍。

TAGS:前端教程

取消回复欢迎 发表评论: