A :checkedCSS álosztálya kiválasztja az elemeket, amikor a kiválasztott állapotban vannak. Csak a rádió és a jelölőnégyzet típusú input ( ) elemekhez van társítva . Az :checkedál-osztály választó megfelel a rádió és a jelölőnégyzet bemeneti típusainak, ha be vannak jelölve, vagy be van kapcsolva. Ha nincsenek kiválasztva vagy be vannak jelölve, nincs egyezés.
Tehát amikor be van jelölve egy jelölőnégyzet, és közvetlenül utána célozza meg a címkét:
input(type=checkbox) + label ( color: #ccc; font-style: italic; ) input(type=checkbox):checked + label ( color: #f00; font-style: normal; ) A címke szövege szürke dőlt betűről piros normál betűvé válik.
CSS is Awesome A CSS fantasztikus
A fenti példa az :checkedál-osztály használatára az űrlapok hozzáférhetőbbé tétele érdekében. Az :checkedál-osztály rejtett bemenetekkel és látható címkéikkel interaktív widgetek, például képgalériák készítéséhez használható.
További források
- A jelölőnégyzet feltörése
- MDN-dokumentumok be: be van jelölve
- A W3C specifikációja: ellenőrizve
Böngésző támogatás
| Króm | Szafari | Firefox | Opera | AZAZ | Android | iOS |
|---|---|---|---|---|---|---|
| Bármi | 3.1+ | Bármi | 9+ | 9+ | Bármi | Bármi |