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

0 / 5

Автор: Администратор

16.07.2015

Теги: css, style, text-decoration, border, border-bottom

В этой статье мы расскажем, как убрать стандартное сплошное подчеркивание у ссылки и добавить на его место пунктирное или даже точечное.

За сплошное подчеркивание ссылок отвечает свойство text-decoration, для отключения сплошного подчеркивания нужно ему задать значение none.

Для того же, чтобы добавить пунктирное,точечное или даже двойное подчеркивание будем использовать свойство border-bottom, важно, чтобы для ссылок не стояло свойство display, со значением block или аналогичным ему, иначе ссылка будет располагаться на всю ширину страницы и подчеркивание появится не только у ссылки но и в пустом пространстве вокруг неё.

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

Остается лишь добавить необходимый стиль для нижнего подчеркивания.

Пример:

<a href="/">Эта ссылка с пунктирным подчеркиванием</a>
<a class="double" href="/">Эта ссылка с двойным подчеркиванием</a>

a {text-decoration:none; border-bottom:dashed 1px #ff0000;}
a.double {text-decoration:none; border-bottom:double 3px #ff0000;}

Вот как это будет выглядеть:

Эта ссылка с пунктирным подчеркиванием Эта ссылка с двойным подчеркиванием

Добавить комментарий

Авторизоваться с помощью:

Поиск по сайту

Топ 10 активных пользователей

Имя пользователя Баллы
gawk
44.20
ZOMRO
26.80
hr@proovelab
15.00
intuit89
8.40
Varvarka
4.00
Akyla58
3.00
AnnaOl
3.00
dimasik_3557
3.00
ErcardSa
3.00
Galinamuh
3.00

Рекламные ссылки

Пожертвования

icon donate

Yandex.Money: 410011571748395

Webmoney:

R362907776401 (Рубли)

Z410919458006 (Доллары)

Похожие материалы

Языки программирования сайтов Просмотров 15185

Приветствую всех посетителей моего сайта. В этой статья я расскажу вам о языках программирования, которые нужны для управления, созданий и разработки своего сайта.

Теги:

css, html, javascript, php, веб

Комментариев: 0 Подробнее

Удобное собрание CSS хаков для самых поп... Просмотров 10120

Удобное собрание CSS хаков для самых популярных браузеров

Для каждого хорошего верстальщика в какой-то момент времени встает вопрос кроссбраузерности. Что такое кроссбраузерность? Это свойство сайта или дизайна сайта отображаться одинакого в разных барузерах. Дело в том, что при создании браузеров разработчики не сильно задумываются о стандартизации, это порождает разное представление одного и того же сайта в их продукции. Создание кроссбраузерной верстки/сайта и позволяет преодолеть эту разницу.

Теги:

css, хаки, hacks, читы

Комментариев: 0 Подробнее

!important в CSS Просмотров 3574

Часто бывает, что люди, давно изучающие CSS, не имеют представления или не понимают до конца как работает директива !important в CSS. В этой статье я постараюсь описать её действие и показать пару примеров, такая статья так же пригодится тем, кто только начал изучать CSS.

Теги:

css, css3, style, !important

Комментариев: 0 Подробнее

Как подключать свои шрифты на сайт, или ... Просмотров 5790