За замовчуванням всі посилання в браузері відображаються з підкресленням, але на сайтах цю можливість іноді відключають та виводять посилання без підкреслення. При наведенні курсору на таке посилання, навпаки, підкреслення додають, щоб користувачеві було простіше розуміти, що перед ним посилання.
Для скасування та додавання підкреслення застосовується властивість text-decoration для селектора A. Щоб підкреслити прибрати, використовуємо значення none, а для його додавання — значення underline, як показано в прикладі 1.
>Приклад 1. Підкреслення при наведенні
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Посилання</title> <style> a {text-decoration: none; /* Забираємо підкреслення у посилань */
}
a:hover { text-decoration: underline; /* Додаємо підкреслення */
}
</style>
</head>
<body> <p><a href="page/new.html">Посилання без підкреслення</a></p> <p><a href="page/new.html">Посилання без підкреслення</a></p>
</body>
</html>Результат даного прикладу показаний не на рис. 1.
Мал. 1. Вигляд посилань