Скрыть/изменить стили выделения в 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

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

Анимация ожидания загрузки/обновления, используя CSS3

Октябрь 26, 2015 г.

Одна из типичных задач для улучшения пользовательского интерфейса на сайтах - это визуализация ожидания загрузки/обновления страницы. Наиболее частый случай ...

Читать

CSS media query - ошибка в округлениях

Март 26, 2025 г.

Я замечал, что медиа запросы могут не срабатывать на границе т.н. брек-поинтов. К примеру, следующее правило может не срабатывать при значении 767 пикс: [crayon-69cdebfc87cff858491268/] Источниками проблем являются фича масштабирования и ...

Читать

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

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

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

Читать

Меняем отступы сетки (gutter-width) в Bootstrap

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

Дефолтова сетка в bootstrap 3 имеет размер 30 пикс. Понятно, что рабочий макет может содержать произвольные отступы и, если вы хотите использовать преимущества работы с grid от бутстрапа, придется как то их менять и фиксить. Фактически нужно сделать ...

Читать
 

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

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



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