Пунктирне підкреслення часто використовується для оформлення посилань, клацання по яких не відкриває посилання, а виконує певну дію в поточному документі.
Для створення лінії слід використовувати властивість border-bottom зі значенням dashed, додаючи його до селектора A. Щоб підкреслення застосовувалося не до всіх посилань, слід створити унікальний клас, назвемо його, скажімо, dot. Також необхідно прибрати вихідне підкреслення у посилань за допомогою text-decoration зі значенням none (приклад 1) .
Приклад 1. Пунктирне підкреслення
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Пунктирне підкреслення</title> <style> a.dot {text-decoration: none; /* Забираємо підкреслення */
border-bottom: 1px dashed red; /* Додаємо свою лінію */
}
</style>
</head>
<body> <p><a href="page/lorem.html">Звичайне посилання</a> на іншу сторінку.</p> <p><a href="#" class="dot">Посилання з пунктирним підкресленням</a>.</p>
</body>
</html>Результат прикладу показано на рис. 1.
Товщина лінії та колір підкреслення у посилань також задаються через властивість border-bottom.