0 просмотров

Как изменить подчеркивание ссылок на веб-странице

Удаляйте подчеркивания, создавайте пунктирные, пунктирные или двойные подчеркнутые ссылки.

  • Делиться
  • флипборд
  • Эл. адрес
  • Калифорнийский университет
  • Вашингтонский университет

Дженнифер Кирнин — профессиональный веб-разработчик, помогающий другим в изучении веб-дизайна, HTML, CSS и XML.

Что нужно знать

  • Удалите подчеркивание текстовых ссылок с помощью свойства CSS text-decoration, введя .
  • Измените подчеркивание на точки с помощью свойства стиля border-bottom a .
  • Измените цвет подчеркивания, набрав . Замените сплошной красный на другой цвет.

В этой статье объясняется несколько способов использования CSS для изменения внешнего вида текстовых ссылок на веб-странице по умолчанию путем удаления подчеркивания, замены его пунктирной линией или изменения цвета. Дополнительная информация включена для изменения подчеркивания на пунктирную линию или двойное подчеркивание.

Как убрать подчеркивание в текстовых ссылках

По умолчанию веб-браузеры имеют определенные стили CSS, которые применяются к определенным элементам HTML. Если вы не перезапишете эти значения по умолчанию собственными таблицами стилей вашего сайта, применяются значения по умолчанию. Для гиперссылок стиль отображения по умолчанию таков, что любой связанный текст выделяется синим цветом и подчёркивается. При желании вы можете изменить внешний вид этих подчеркиваний или полностью удалить их со своей веб-страницы.

Чтобы удалить подчеркивание из текстовых ссылок, вы используете CSS-свойство text-decoration. Вот CSS, который вы пишете для этого:

Поскольку вы удалили стандартное подчеркивание, отображается только пунктирное.

Вы можете сделать то же самое, чтобы получить тире. Просто измените стиль border-bottom на пунктирный:

Как изменить цвет подчеркивания

Еще один способ привлечь внимание к вашим ссылкам — изменить цвет подчеркивания. Просто убедитесь, что цвет соответствует вашей цветовой гамме.

Двойное подчеркивание

Хитрость использования двойных подчеркиваний заключается в том, что вам нужно изменить ширину границы. Если вы создадите рамку шириной 1 пиксель, вы получите двойное подчеркивание, которое выглядит как одинарное подчеркивание.

Вы также можете использовать существующее подчеркивание, чтобы сделать двойное подчеркивание с другими функциями, такими как пунктирная линия:

Не забывайте о состояниях ссылок

Вы можете добавить стиль border-bottom к своим ссылкам в различных состояниях, таких как :hover, :active или :visited. Это может создать у посетителей приятную атмосферу в стиле «прокрутки», когда вы используете этот псевдокласс «наведения». Чтобы при наведении указателя мыши на ссылку отображалось второе подчеркивание:

голоса
Рейтинг статьи
Статья в тему:  Факты об акулах-спиннерах (Carcharhinus brevipinna)
Ссылка на основную публикацию
0
Оставьте комментарий! Напишите, что думаете по поводу статьи.x
Adblock
detector