Radio (<input type = “radio”>) dan elemen checkbox (<input type = “checkbox”>) dapat diubah oleh pengguna. Beberapa item menu “di checked” ketika pengguna memilihnya. Ketika elemen-elemen tersebut diaktifkan “on”: centang pseudo-class berlaku.

Jadi, pseudo-class :checked digunakan untuk memilih dan gaya kotak centang (<input type = “checkbox”>), radio (<input type = “radio”>) atau opsi (<option> </ option> dalam <select> </ pilih>) yang dicentang atau “diaktifkan” oleh pengguna.

Tombol radio dan kotak centang berikut dapat diaktifkan dan dinonaktifkan.

Ini juga digunakan untuk memilih item radio dan kotak centang yang atribut pemeriksaannya secara eksplisit ditetapkan oleh penulis, atau pilih opsi yang atribut yang dipilih secara eksplisit ditetapkan.

Pseudo-class :checked awalnya berlaku untuk elemen-elemen ini, tetapi tentu saja pengguna dapat beralih “off” elemen-elemen tersebut dalam hal ini tidak akan berlaku lagi.

Elemen radio dan kotak centang dapat diubah oleh pengguna, tetapi terkadang dalam keadaan tidak tentu, tidak dicentang atau tidak dicentang. Ini dapat disebabkan oleh atribut elemen, atau manipulasi DOM. Elemen semacam itu dapat ditata menggunakan: kelas pseudo yang tidak ditentukan.

Styling: label input yang dicentang bisa sangat berguna untuk membuat input ini lebih mudah diakses. Setiap isyarat visual yang membantu pengguna mengetahui perbedaan antara dua negara selalu berguna. Misalnya, contoh berikut menggunakan pendekatan todo-list-like untuk mencoret label yang kotak centangnya dicentang.

Contoh HTML:

Contoh CSS:

Sehingga hasil akhirnya, jika kita memberi centang pada kotak centangnya maka teks Buy Milk akan di coret, dan warnanya berubah jadi warna abu-abu.