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

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

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

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

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

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

Убираем нативный крестик в поле ввода под IE

Май 13, 2018 г.

Во время ввода в текстовом поле IE появляется "крестик", который позволяет очистить поле в один клик. Иногда стиль, и вообще наличие этого крестика, не ...

Читать

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

Июнь 21, 2020 г.

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

Читать

Анимация свечения (мерцание)

Апрель 18, 2025 г.

Здесь мы разбираем CSS анимацию - мерцание. Это статья из цикла заметок по CSS анимации и эффектам. Эта анимация создаёт эффект мягкого свечения вокруг элемента, будто он излучает свет. Часто используется для привлечения внимания к кнопкам, ...

Читать

Позиционирование фона с помощью background-position

Май 3, 2018 г.

В CSS, для позиционирования фонового изображения в контейнере, мы используем свойство background-position. Свойство можно задать отдельно для оси X и Y,  кроме того можно задать 2, 3 или 4 параметра. Классический случай - позиционирование с ...

Читать
 

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

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



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