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

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

Автомасштабирование изображений

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

Сейчас очень модными стали адаптивные версии дизайна, которые умеют подстраиваются под размер экрана устройства, на котором открыли сайт. Столбцы (сайдбары, ...

Читать

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

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

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

Читать

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

Июнь 21, 2020 г.

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

Читать

Как делаются сайты с адаптивным дизайном?

Апрель 7, 2016 г.

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

Читать
 

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

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



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