В :checkedпсевдо-класа в CSS избира елементи, когато те са в избраната държава. Той е свързан само с входни ( ) елементи от тип радио и квадратче за отметка. В :checkedселектора псевдо-класа мачове и отметката входен тип, когато се проверява или превключва към състоянието. Ако не са избрани или отметнати, няма съвпадение.
Така че, когато е поставена отметка в квадратчето и насочвате етикета веднага след него:
input(type=checkbox) + label ( color: #ccc; font-style: italic; ) input(type=checkbox):checked + label ( color: #f00; font-style: normal; ) Текстът на етикета ще се превърне от сив курсив в червен нормален шрифт.
CSS is Awesome CSS е страхотен
Горното е пример за използване на :checkedпсевдокласа, за да направи формулярите по-достъпни. В :checkedпсевдо-класа може да се използва с скрити входове и видимите им етикети за изграждане на интерактивни джаджи, като картинни галерии.
Още ресурси
- Хак в квадратчето за отметка
- Документи на MDN включени: отметка
- Спецификацията на W3C за: проверено
Поддръжка на браузър
| Chrome | Сафари | Firefox | Опера | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Всякакви | 3.1+ | Всякакви | 9+ | 9+ | всякакви | всякакви |