CSS-свойство text-decoration-color устанавливает цвет линии, которая добавляется через свойство text-decoration. Толщина линии зависит от размера шрифта.
<a href="#">Ссылка с подчёркиванием</a>a {
text-decoration-skip-ink: none;
text-decoration: underline;
text-decoration-color: red;
}
a:hover {
text-decoration-color: #f56666;
}Пример:
Поддержка в браузерах:
Второй вариант – сделать подчеркивание с помощью нижней рамки:
<a href="#">Ссылка с подчёркиванием</a>a {
font-size: 16px;
text-decoration: none;
border-bottom: solid 2px red;
}
a:hover {
border-bottom-color: #f56666;
}
