Abakada: Back to Basics > Language References > CSS Properties > Pseudo-Classes > checked Pseudo-class

---

Sets the style of elements in a checked or selected state.

selector:checked { property: value; }

property	Any valid CSS property.
value	Any of the range of values available to the corresponding property.

The :checked pseudo-class applies styles to elements that are in a checked or selected state. These include:

• <input type=checkbox> elements
• <input type=radio> elements
• <option> elements of a select

The syntax for using the :checked pseudo-class is straightforward. A selector precedes the pseudo-class.

For example, to change the background color of the selected option in a <select> control:

option:checked { background-color: steelblue }

The following demonstrates use of the :checked pseudo-class to set styles for elements whose checked state evaluates to true.

 Show me 

• 13.2.1. The Selected-option Pseudo-class: :checked