Свойство text-decoration позволяет задавать некоторые эффекты для текста: подчеркивание, перечеркивание, линию сверху, а также отменять такие эффекты, если какой-либо тег имеет их по умолчанию. Чаще всего это свойство используются для отмены подчеркивания ссылок (они по умолчанию подчеркнуты).
Давайте посмотрим, какие значения может принимать свойство text-decoration.
Значение underline
Значение underline добавляет подчеркивание тексту:
<p>
Lorem ipsum dolor sit amet.
</p>
p {
text-decoration: underline;
}
:
Значение overline
Значение overline добавляет линию над текстом:
<p>
Lorem ipsum dolor sit amet.
</p>
p {
text-decoration: overline;
}
:
Значение line-through
Значение line-through добавляет линию, перечеркивающую текст:
<p>
Lorem ipsum dolor sit amet.
</p>
p {
text-decoration: line-through;
}
:
Значение none
Значение none отменяет все эффекты. Обычно используется для отмены подчеркивания ссылок.
Смотрите пример:
<a href="">ссылка</a>
a {
text-decoration: none;
}
:
Практические задачи
Повторите страницу по данному образцу:
Повторите страницу по данному образцу:
Повторите страницу по данному образцу:
Повторите страницу по данному образцу: