Свойство CSS text-decoration
– это короткая запись нескольких других свойств для создания у текста линий. Полные названия свойств такие:
text-decoration-line
– определяет способ добавления линии: подчеркивание, перечеркивание, надчеркивание. Значения:line-through
,overline
,underline
,none
.text-decoration-color
– устанавливает цвет линии.text-decoration-style
– стиль линии. Значения:solid
,double
,dotted
,dashed
,wavy
.text-decoration-thickness
– толщина линии.
Может быть указано несколько значений через пробел.
Пример использования (убираем у ссылки подчеркивание, которое есть по умолчанию):
a {
text-decoration: none;
}
Если
text-decoration: none
у вас не работает, скорее всего эту инструкцию перебивает другая с более высоким приоритетом. Попробуйте повысить приоритет с помощьюimportant
таким образом:text-decoration: none !important
.
Надо отметить, что с помощью
text-decoration
невозможно задать отступ от текста до линии. Что задать нужное расстояние до линии следует использовать сочетания свойствborder
(рамка вокруг элемента) иpadding
(внутренний отступ элемента). Их нужно применять к одной стороне, например:border-bottom
(линия снизу) иpadding-bottom
(отступ сверху).
Еще несколько примеров, на которых наглядно видно применение свойств.
See the Pen
text-decoration by Андрей (@adlibi)
on CodePen.
Прежде существовало еще одно значение свойства –
blink
, но в настоящий момент оно устарело и не поддерживается браузерами.