Pseudo-classes em CSS

selector:pseudo-class {property: value}

a:link {color: #FF0000}     /* unvisited link */
a:visited {color: #00FF00}  /* visited link */
a:hover {color: #FF00FF}   /* mouse over link */
a:active {color: #0000FF}   /* selected link */

a.red:visited {color: #FF0000}

<a class="red" href="css_syntax.asp">CSS Syntax</a>

Neste exemplo, o seletor associa-se a qualquer elemento p que seja o first child de um elemento div, e recua o primeiro parágrafo dentro de um elemento div:

div > p:first-child
{
text-indent:25px
}

Este seletor associar-se-á com o primeiro parágrafo dentro de div na HTML seguinte:

<div>
<p>
Primeiro parágrafo em div.
Este parágrafo será recuado.
</p>
<p>
Segundo parágrafo em div.
Este parágrafo não será recuado.
</p>
</div>

mas não associar-se-á com o parágrafo desta HTML:

<div>
<h1>Header</h1>
<p>
Primeiro parágrafo de div.
Este parágrafo não será recuado.
</p>
</div>

Neste exemplo, o seletor associa-se a qualquer elemento que seja o first child de um elemento p, e especifica a espessura da fonte (font-weight) para negrito (bold) para o primeiro em dentro de um elemento p:

p:first-child em
{
font-weight:bold
}

Por exemplo, o em na HTML abaixo é o first child do parágrafo:

<p>I am a <em>strong</em> man.</p>

Neste exemplo, o seletor associa-se a qualquer elemento a que seja o first child de qualquer elemento, e especifica a text-decoration para none (nenhuma):

a:first-child
{
text-decoration:none
}

Por exemplo, o primeiro a na HTML abaixo é o first child do parágrafo e não será sublinhado. Mas o segundo a no parágrafo não é o first child do parágrafo e será sublinhado:

<p>
Visite <a href="http://www.w3schools.com">W3Schools</a>
e aprendaCSS!
Visite <a href="http://www.w3schools.com">W3Schools</a>
e aprenda HTML!
</p>