Для удобства пользователя, браузеры применяют специальные стили к выделенному тексту. Данные стили могут нарушать дизайн, смотреться не гармонично в верстке, и потому нужно иметь возможность изменить или убрать данный эффект.
В моих проектах я сталкиваюсь с необходимостью устранения данной встроенной стилизации для элементов, выполняющих роль -переключателей, кнопок, созданных из не стандартных элементов форм, а запрограммированных для этого элементов html.
В CSS есть специальный псевдокласс, который управляет стилем выделенного фрагмента:
|
|
div::selection { background-color: transparent; } |
В примере выше, показано как сделать фон выделения прозрачным, невидимым.
Данный псевдокласс поддерживает ограниченный набор CSS свойств. Вот их перечень:
- color
- background-color
- cursor
- caret-color
- outline and its longhands
- text-decoration and its associated properties
- text-emphasis-color
- text-shadow
Данная запись опубликована в 12.03.2019 15:08 и размещена в рубрике Танцы с CSS.
Вы можете перейти в конец страницы и оставить ваш комментарий.
Мало букафф? Читайте есчо !
Август 29, 2019 г.
Небольшие векторные элементы очень удобно вставлять как часть CSS кода. Хочу показать пример, как сделать их еще и параметрически зависимыми, при компиляции из LESS.
К примеру, при ребрендинге или использовании кусочка стилей на другом сайте, вы ...
Читать
Сентябрь 1, 2025 г.
Ещё недавно для прогресс-бара чтения на сайте приходилось подключать JavaScript: отслеживать событие scroll, вычислять процент прокрутки и менять ширину элемента. Теперь это можно сделать чисто на CSS, благодаря новой возможности — Scroll-driven animations. ...
Читать
Октябрь 10, 2017 г.
Классическая задача о позиционировании контейнера относительно центра родительского блока. Я писал уже о некоторых простых способах установить контейнер ...
Читать
Май 3, 2018 г.
В CSS, для позиционирования фонового изображения в контейнере, мы используем свойство background-position.
Свойство можно задать отдельно для оси X и Y, кроме того можно задать 2, 3 или 4 параметра.
Классический случай - позиционирование с ...
Читать