В браузерах на движке chromium (Chrome, Opera) по умолчанию есть «подсветка» поля, получившего фокус ввода. Смотрим как убрать данный стиль.
Давайте посмотрим специфические стили браузера для случая :focus. Вот что показывают developer tools:
Видно, что рамка подсветки создаётся стилем outline.
Добавим собственный стиль, чтобы переписать установленные браузером:
|
|
input:focus { outline: none; } |
Данная запись опубликована в 18.05.2018 13:30 и размещена в рубрике Танцы с CSS.
Вы можете перейти в конец страницы и оставить ваш комментарий.
Мало букафф? Читайте есчо !
Июль 15, 2025 г.
В CSS размеры можно задавать с помощью разных единиц измерения: rem, em, px, % и другие. Разберём ключевые различия между rem, em и прочими.
EM - размер относительно размера шрифта родителя
[crayon-6a721659e4f0b733578924/]
2em внутри .child ...
Читать
Апрель 26, 2025 г.
Эта анимация создаёт эффект, будто элемент "приподнимается" над страницей, становясь более заметным. Обычно для этого используется свойство box-shadow, иногда в сочетании с лёгким смещением (transform: translateY(-2px)).
Это статья из цикла заметок ...
Читать
Сентябрь 1, 2025 г.
Ещё недавно для прогресс-бара чтения на сайте приходилось подключать JavaScript: отслеживать событие scroll, вычислять процент прокрутки и менять ширину элемента. Теперь это можно сделать чисто на CSS, благодаря новой возможности — Scroll-driven animations. ...
Читать
Март 29, 2025 г.
Иногда требуется, чтобы стили или часть стилей, формируемых миксином, добавлялись однократно.
Например, ваш миксин добавляет анимацию и при этом объявляет блок @keyframes, который не зависит от параметров и для всех анимированных блоков одинаков. ...
Читать