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

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

CSS высота равна ширине

Август 11, 2019 г.

Ширина и высота контейнера - независимые параметры, но иногда хотелось бы чтобы связь между ними была, к примеру, для сохранения пропорций контейнера при адаптивной верстке. Прямой связи в CSS между width и height нет, и нет возможности задать ...

Читать

Способы прижать HTML элемент к нижнему краю экрана

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

Много занимаюсь версткой, потому возникают разные интересные задачи. Решил не оставлять без внимания этот интересный опыт. Одна из таких задач, которая ...

Читать

Zoom-эффект на CSS3

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

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

Читать

Центровка HTML с помощью абсолютного позиционирования

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

Классическая задача о позиционировании контейнера относительно центра родительского блока. Я писал уже о некоторых простых способах установить контейнер ...

Читать
 

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

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



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