Псевдоклас :checked

Оновлено: 11.01.2023

Псевдоклас :checked

Псевдоклас :checked застосовується до елементів інтерфейсу, таких як перемикачі (checkbox), прапорці (radio) і пункти списку (option), коли вони перебувають у положенні "увімкнено". Перемикання елементів у такий стан відбувається за допомогою атрибута checked елемента <input> або користувачем.

Синтаксис

<i>Селектор</i>:checked { ... }

Приклади використання

input[type="radio"]:checked { ... }

Стиль застосовується тільки до ввімкнених перемикачів.

input[type="checkbox"]:checked { ... }

Стиль застосовується тільки до позначених прапорців (чекбоксів).

option:checked { ... }

Стиль застосовується тільки до обраних елементів списку.

Приклад

У цьому прикладі текст біля позначених прапорців виділяється фоновим кольором.

Браузери

:checked

Переглянути сумісність з Can I use?

:checked