css 伪元素 :hover :active :before :after :visited :link :focus ...

所有CSS伪类/元素

选择器	示例	示例说明
:link	a:link	选择所有未访问链接
:visited	a:visited	选择所有访问过的链接
:active	a:active	选择正在活动链接(点击后的效果)
:hover	a:hover	把鼠标放在链接上的状态
:focus	input:focus	选择元素输入后具有焦点
:first-letter	p:first-letter	选择每个<p> 元素的第一个字母
:first-line	p:first-line	选择每个<p> 元素的第一行
:first-child	p:first-child	选择器匹配属于任意元素的第一个子元素的 <]p> 元素
:before	p:before	在每个<p>元素之前插入内容
:after	p:after	在每个<p>元素之后插入内容
:lang(language)	p:lang(it)	为<p>元素的lang属性选择一个开始值

例子：

<style>
p.a:before
{
    content:"Read this -";
}
</style>
</head>

<body>
<p class="a">My name is Donald</p>
<p class="a">I live in Ducksburg</p>

<p class="a"><b>注意:</b>  :before 作用于 IE8,DOCTYPE 必须已经声明.</p>

My name is Donald

I live in Ducksburg

注意: :before 作用于 IE8,DOCTYPE 必须已经声明.

例子：

<style>
.b:active
{
    background-color:yellow;
}
</style>
</head>
<body>

<a class="b" href="http://www.runoob.com/">runoob.com</a>
<a class="b" href="http://www.wikipedia.org">wikipedia.org</a>

<p><b>注意:</b>  :active选择器样式触发时链接到链接页面</p>

runoob.com wikipedia.org

注意: :active选择器样式触发时链接到链接页面