超链接
a:link
{color: #FF0000}
a:visited
{color: #00FF00}
a:hover
{color: #FF00FF}
a:active
{color: #0000FF}
a:hover 必须被置于 a:link 和 a:visited 之后
a:active 必须被置于 a:hover 之后
:focus
input:focus
{
background-color:yellow;
}
:first-child
<p>These are the necessary steps:</p>
<ul>
<li>Intert Key</li>
<li>Turn key <strong>clockwise</strong></li>
<li>Push accelerator</li>
</ul>
<p>Do <em>not</em> push the brake at the same time as the accelerator.</p>
</div>
p:first-child {font-weight: bold;}
作为某元素第一个子元素的所有 p 元素设置为粗体
li:first-child {text-transform:uppercase;}
作为某个元素(在 HTML 中,这肯定是 ol 或 ul 元素)第一个子元素的所有 li 元素变成大写
:lang
:lang(en) > Q { quotes: '\201C' '\201D' '\2018' '\2019'; }
:lang(fr) > Q { quotes: '« ' ' »'; }
:lang(de) > Q { quotes: '»' '«' '\2039' '\203A'; }
<div lang="fr"><q>This French quote has a <q>nested</q> quote.</q></div>
<div lang="de"><q>This German quote has a <q>nested</q> quote.</q></div>
<div lang="en"><q>This English quote has a <q>nested</q> quote.</q></div>