Нижнее подчеркивание текста пунктиром...
Доброго времени суток читатель. Если ты зашел сюда и читаешь эту статью значить тебе не подходит text-decoration:underline;
И ты хочешь красивое подчеркивание и может даже другого цвета в отличии от ссылки.
А сделать такое можно таким способом:
-
a {
-
color:#fff;
-
border-bottom:1px dashed #fff;
-
text-decoration:none;
-
}
-
a:hover {
-
text-decoration:none;
-
border-bottom:0px;
-
}
Строчка border-bottom:1px dashed #fff;, означает что мы делаем нижнее подчеркивание пунктиром и белого цвета, color:#fff; это цвет ссылки, text-decoration:none; ставим что бы невзначай где то не вылезло стандартное подчеркивание.
При наведении я убераю подчеркивание, но можно его сделать например другим шрифтом, или приминив нижний паддинг увеличть ростояние мужду словом и подчеркиванием. В общем способов использования много, экспериментируйте.
В общем то вроде и всё. Пользуйтесь на здоровье.
Комментарии
а примеры показать?
ясно что и так все ясно но примеры это всегда круче чем нет примеров и нагляднее
Я как то даже не задумывался
Я как то даже не задумывался о том что нужно пример для этого момента. ПО сути если человек зашел в эту статью с поисковика значит он уже знает что ищет. Пример может быть меню слева (Рубрикатор блога), там правда бекграундом сделано, но бордером очень похоже.