pseudoklas :checked CSS3

definisi dan penggunaan

CSS :checked pseudoklas digunakan untuk padan kepada mana-mana yang dipilih <input> atau <option> elemen.

ini berlaku untuk <input type="radio">, <input type="checkbox"> serta <select> elemen <option>.

contoh

contoh 1

tetapkan garis luar kecil merah untuk semua elemen <input> yang dipilih:

input:checked {
  garis luar: 1px tegak lurus merah;
}

cuba sendiri

contoh 2

tetapkan gaya yang berbeza untuk tombol pilihan, kotak centang dan pilihan yang dipilih:

input[type="radio"]:checked {
  bayangan: 0 0 5px 3px biru;
}
input[type="checkbox"]:checked {
  bayangan: 0 0 5px 3px maroon;
}
option:checked {
  warna: biru;
  background-color: biru muda;
}

cuba sendiri

gramatika CSS

:checked {
  pengumuman css;
}

perincian teknikal

versi: CSS3

pemilihan pelayar

nombor di dalam tabel menunjukkan versi paling awal penggunaan pseudoklas yang disokong sepenuhnya.

Chrome Edge Firefox Safari Opera
4.0 9.0 3.5 3.2 9.6