首页 > 代码库 > CSS中伪类选择器及伪元素

CSS中伪类选择器及伪元素

1.伪类选择器

在CSS中,最常用的伪类选择器是使用在a(锚)元素上的几种选择器,它们的使用方法如下:

a:link{color:#FF0000;text-decoration:none}

a:visited{color:#FF0000;text-decoration:none}

a:hover{color:#FF0000;text-decoration:none}

a:active{color:#FF0000;text-decoration:none}

2.伪元素选择器

伪元素选择器不是针对真正的元素使用的选择器,而是针对CSS中已经定义好的伪元素使用的选择器,在CSS中主要有如下四个伪元素选择器:

(1)first-line伪元素选择器

<style type=text/css>

p:first-line{color:#0000FF};

</style>

(2)first-letter伪元素选择器

向某个元素中的文字的首字母(欧美文字)或第一个字(中日等汉字)使用样式。

 

<style type=text/css>

 

p:first-letter{color:#0000FF};

 

</style>

(3)before伪元素选择器

before伪元素选择器拥有在某个元素之前插入一些内容,使用方法如下:

元素:before{

content:""

}

<style type="text/css">

li:before{content:"hello"}

</style>

(4)after伪元素选择器

<style type="text/css">

li:after{

content:"hello";

font-size:12px;

color:red;

}

</style>

 

CSS中伪类选择器及伪元素