Убираем подсветку поля при фокусе ввода в Chrome

В браузерах на движке chromium (Chrome, Opera) по умолчанию есть «подсветка» поля, получившего фокус ввода. Смотрим как убрать данный стиль.

Давайте посмотрим специфические стили браузера для случая :focus. Вот что показывают developer tools:

Видно, что рамка подсветки создаётся стилем outline.

Добавим собственный стиль, чтобы переписать установленные браузером:

Мало букафф? Читайте есчо !

Переносы элементов сетки bootstrap разной высоты (фикс для версии 3.x)

Май 2, 2021 г.

В третей версии бутстрапа используется выравнивание элементов сетки col-* с помощью свойства float: left;. Пока элементы в сетке имеют одинаковую высоту, ...

Читать

Анимация прокрутки в CSS: animation-timeline: scroll()

Сентябрь 1, 2025 г.

Ещё недавно для прогресс-бара чтения на сайте приходилось подключать JavaScript: отслеживать событие scroll, вычислять процент прокрутки и менять ширину элемента. Теперь это можно сделать чисто на CSS, благодаря новой возможности — Scroll-driven animations. ...

Читать

Выравнивание блока HTML (вертикально и горизонтально)

Сентябрь 17, 2015 г.

Центровка элемента - одна из типовых задач в верстке. Решать её можно по разному, рассмотрим некоторые способы. Горизонтальная центровка. С центровкой ...

Читать

Пропорциональное заполнение контейнера картинкой

Ноябрь 29, 2017 г.

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

Читать
 

Комментарии к «Убираем подсветку поля при фокусе ввода в Chrome»

Понравилась статья? Есть вопросы? - пишите в комментариях.



Комментарий: