Скрыть/изменить стили выделения в HTML — псевдокласс css::selection

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

В моих проектах я сталкиваюсь с необходимостью устранения данной встроенной стилизации для элементов, выполняющих роль -переключателей, кнопок, созданных из не стандартных элементов форм, а запрограммированных для этого элементов html.

В CSS есть специальный псевдокласс, который управляет стилем выделенного фрагмента:

В примере выше, показано как сделать фон выделения прозрачным, невидимым.

Данный псевдокласс поддерживает ограниченный набор CSS свойств. Вот их перечень:

  • color
  • background-color
  • cursor
  • caret-color
  • outline and its longhands
  • text-decoration and its associated properties
  • text-emphasis-color
  • text-shadow

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

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

Май 2, 2021 г.

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

Читать

Верстка: большой блок слева и четыре малых справа

Март 15, 2025 г.

Дизайнеры любят разные компоновки блоков, но не всегда удобно использовать таблицы для верстки, чтобы воплотить дизайн в HTML. Рассмотрим одну из компоновок, ...

Читать

Почему не работает стиль :: before или :: after?

Октябрь 22, 2017 г.

Замечательные псевдо-классы, которые позволяют добавить виртуальные контейнеры в начало или конец контейнера. Как они работают и почему могут "не сработать"? ...

Читать

Ошибка background-size:cover в Firefox при рендеринге svg

Сентябрь 21, 2021 г.

По какой то причине firefox не верно отрабатывает свойство background-size: cover для SVG. Чтобы воспроизвести попробуйте задать стили вроде: [crayon-69af01c243b64172919276/] Чтобы исправить ситуацию, вы можете заменить размер фона на следующий: ...

Читать
 

Комментарии к «Скрыть/изменить стили выделения в HTML — псевдокласс css::selection»

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



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