Kelas :checked
pseudo dalam CSS memilih elemen ketika berada dalam keadaan yang dipilih. Ia hanya dikaitkan dengan input ( ) elemen radio jenis dan kotak pilihan. The
:checked
pemilih pseudo-kelas perlawanan jenis input radio dan kotak semak apabila diperiksa atau ditoggel kepada kepada keadaan. Sekiranya mereka tidak dipilih atau diperiksa, tidak ada pertandingan.
Oleh itu, apabila kotak centang dicentang, dan anda menyasarkan label sebaik sahaja:
input(type=checkbox) + label ( color: #ccc; font-style: italic; ) input(type=checkbox):checked + label ( color: #f00; font-style: normal; )
Teks label akan bertukar dari huruf miring kelabu menjadi font normal merah.
CSS is Awesome
CSS Hebat
Di atas adalah contoh penggunaan kelas :checked
pseudo untuk menjadikan borang lebih mudah diakses. Kelas :checked
pseudo dapat digunakan dengan input tersembunyi dan label yang dapat dilihat untuk membina widget interaktif, seperti galeri gambar.
Lebih Banyak Sumber
- Peretasan kotak pilihan
- Dokumen MDN di: diperiksa
- Spesifikasi W3C pada: diperiksa
Sokongan Penyemak Imbas
Chrome | Safari | Firefox | Opera | IE | Android | iOS |
---|---|---|---|---|---|---|
Sebarang | 3.1+ | Sebarang | 9+ | 9+ | ada | ada |