Колір посилання встановлюється через властивість color, яка додається до селектора A. Для зміни кольору посилання при наведенні на неї курсора миші застосовується псевдоклас :hover, а щоб зміна кольору відбувалася плавно, до селектора A слід додати властивість transition, значенням якого є час. Воно вказується зазвичай у секундах або мілісекундах (приклад 1).
Приклад 1. Зміна кольору посилань
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Колір посилань</title> <style> a { color: blue; /* Синій колір посилань */
transition: 1s; /* Час зміни */
}
a:hover { color: red; /* Червоний колір посилання*/}
</style>
</head>
<body> <p>Для збирання <a href="page/techinfo.html">мегадроїда</a> потрібно відкрити коробку, дістати мішечок з мікросхемами і скласти їх у потрібному порядку, користуючись нашим докладним 8631-сторінковим <a href="page/help.html">керівництвом</a>.</p>
</body>
</html>У даному прикладі для наочності вибрані контрастні кольори та заданий час переходу одна секунда. На робочому сайті час переходу підбирайте за своїм смаком і бажанням.