Часто возникает необходимость задать ссылке какой-нибудь оригинальный стиль: цвет; цвет при наведении курсора; цвет после посещения; подчёркнута или нет; ведь стандартный вариант оформления ссылки не особо "красив".

Сделаем пример из двух ссылок:

Первая ссылка – ссылка подчёркнута; при наведении курсора меняется цвет ссылки и исчезает линия подчёркивающая ссылку; после того как на ссылку кликнут её цвет измениться.

Вторая ссылка – ссылка не подчёркнута; при наведении курсора меняется цвет ссылки и появляется линия; после того как на ссылку кликнут её цвет так же измениться, а подчёркивания не будет.

<style>
a.my_hov_0 {

    color:#7B8BFF;
	outline: none;
	text-decoration: underline;
}

a.my_hov_0:hover {

    color:#7BF8FF;
	outline: none;
	text-decoration: none;
}

a.my_hov_0:visited  {

    color:#BAA8FF;
}


a.my_hov_1 {

    color:#F1D165;
	outline: none;
	text-decoration: none;
}

a.my_hov_1:hover {

    color:#F19165;
	outline: none;
	text-decoration: underline;
}

a.my_hov_1:visited  {

    color:#C7C110;
}
</style>

<p><a href="#" class="my_hov_0">Первая ссылка</a></p>
<p><a href="#" class="my_hov_1">Вторая ссылка</a></p>

Первая ссылка

Вторая ссылка