66 просмотров

Для чего нужна и как убрать пунктирную обводку ссылок

Каждый раз, когда вы открываете ссылку, она выделяется пунктирной обводкой. Заядлые перфекционисты атакуют меня вопросами «как убрать обводку ссылок»: в меню, на кнопках, у простых ссылок.

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

Удалить обводку ссылок:

a:focus {outline: none;}

Пример оформления обводки ссылок

HTML (сделаем ссылку на саму себя)

<a id="result" class="test-a" href="#result">Тестовая ссылка</a>

CSS примера

a.test-a:focus {
  background: #FFFF00;
  outline: #FF0000 dashed 1px;
  padding: .3rem .5rem;
}

a.test-a:focus:after {
  content: " в состоянии Фокус";
}

Результат:

Тестовая ссылка

Полезное чтиво по теме

http://www.outlinenone.com/
https://webref.ru/css/outline
https://toster.ru/q/206380
http://xiper.net/collect/html-and-css-tricks/css-tricks/dotted-border-focus-elements
http://htmlbook.ru/faq/kak-ubrat-punktirnuyu-ramku-vokrug-ssylok

Присоединяйся:
Сайт — https://wplovers.pw