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

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

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

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

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

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

Как сделать чтобы scss mixin добавлял стили однократно

Март 29, 2025 г.

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

Читать

Как работает position: sticky с bottom: 0 и почему он "не работает"

Август 6, 2025 г.

Иногда кажется, что position: sticky работает только с top. Указываешь bottom: 0 — и ничего не происходит. Особенно, если пытаешься сделать так, чтобы элемент "прилип" к нижней границе контейнера при прокрутке. Почему так? На деле position: sticky ...

Читать

SVG to CSS конвертер

Июнь 21, 2020 г.

Небольшая тулза по конвертации SVG картинок в CSS backgroung-image код. Рекомендую предварительно произвести оптимизацию изображения, убрать лишние/невидимые слои, маркеры программ редакторов SVG, лишние теги и т.п. Вы можете загрузить SVG в ...

Читать

Использование CSS градиента цвета для текста

Февраль 28, 2022 г.

Хорошо известна функция linear-gradient, используемая для background. Нельзя ли её применить для оформления текста? Как оказывается, такая возможность ...

Читать
 

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

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



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