mozilla

Compare Revisions

:checked

Change Revisions

Revision 294114:

Revision 294114 by teoli on

Revision 318791:

Revision 318791 by ethertank on

Title:
:checked
:checked
Slug:
CSS/:checked
CSS/:checked
Tags:
"css", "CSS Reference", "CSS Référence", "Selectors"
"css", "CSS Reference", "Selectors"
Content:

Revision 294114
Revision 318791
nn7    <div>
8      {{ CSSRef() }}
9    </div>
10    <h2 id="Summary" name="Summary">
11      Summary
12    </h2>
n8      {{ CSSRef() }}n14      The <code>:checked</code> CSS <a href="/en-US/docs/CSS/Pseu
 >do-classes" title="Pseudo-classes">pseudo-class</a> selector repr
 >esents any <strong>radio</strong> (<code>&lt;input type="radio"&g
 >t;</code>), <strong>checkbox</strong> (<code>&lt;input type="chec
 >kbox"&gt;</code>) or <strong>option</strong> ({{ HTMLElement("opt
 >ion") }} in a {{ HTMLElement("select") }}) element that is checke
 >d or toggled to an <code>on</code> state. The user can change thi
 >s state by clicking on the element, or selecting a different valu
 >e, in which case the <code>:checked</code> pseudo-class no longer
 > applies to this element, but will to the relevant one.
n10    <h2 id="Summary">n16    <h2 id="Syntax" name="Syntax">
11      Summary
12    </h2>
13    <p>
14      The <code>:checked</code> CSS <a href="/en/CSS/Pseudo-class
>es" title="Pseudo-classes">pseudo-class</a> selector represents a 
>ny <strong>radio</strong> (<code>&lt;input type="radio"&gt;</code 
>>), <strong>checkbox&nbsp;</strong>(<code>&lt;input type="checkbo 
>x"&gt;</code>) or <strong>option&nbsp;</strong>({{ HTMLElement("o 
>ption") }} in a {{ HTMLElement("select") }}) element that is chec 
>ked or toggled to an <code>on</code> state. The user can change t 
>his state by clicking on the element, or selecting a different va 
>lue, in which case the <code>:checked</code> pseudo-class no long 
>er applies to this element, but will to the relevant one. 
15    </p>
16    <h2 id="Syntax">
n19    <pre>n19    <pre class="syntaxbox">
n22    <p>n22    <h2 id="Examples" name="Examples">
n24    </p>n24    </h2>
25    <h4 id="Example_selectors">25    <h3 id="Example_selectors" name="Example_selectors">
n27    </h4>n27    </h3>
n36<code>input[type="radio"]:checked {n36  input[type="radio"]:checked {
n39</code>n39 
n70    <h4 id="Using_hidden_checkboxes_in_order_to_store_some_CSS_bon70    <h3 id="Using_hidden_checkboxes_in_order_to_store_some_CSS_bo
>olean_values">>olean_values" name="">
n72    </h4>n72    </h3>
nn114 
n147    <h4 id="Using_hidden_radioboxes_in_order_to_store_some_CSS_bon148    <h3 id="Using_hidden_radioboxes_in_order_to_store_some_CSS_bo
>olean_values">>olean_values" name="Using_hidden_radioboxes_in_order_to_store_som
 >e_CSS_boolean_values">
n149    </h4>n150    </h3>
n154      <strong>Note:</strong> For an analogous effect, but based on155      <strong>Note:</strong> For an analogous effect, but based o
>n <a class="internal" href="/En/CSS/:hover" title="en/CSS/:hover">n <a class="internal" href="/en-US/docs/CSS/:hover" title="CSS/:h
>><code>:hover</code></a> pseudo-class and without hidden radiobox>over"><code>:hover</code></a> pseudo-class and without hidden rad
>es, see <a class="internal" href="/@api/deki/files/6247/=css-gall>ioboxes, see <a class="internal" href="/@api/deki/files/6247/=css
>ery.zip" title="css-gallery.zip">this demo</a>, taken from the <a>-gallery.zip" title="css-gallery.zip">this demo</a>, taken from t
> class="internal" href="/En/CSS/:hover" title="en/CSS/:hover">En/>he <a class="internal" href="/en-US/docs/CSS/:hover" title="CSS/:
>CSS/:hover</a> page.>hover">:hover</a> page.
n156    <h2 id="Specifications">n157    <h2 id="Specifications" name="Specifications">
157      <span>Specifications</span>158      Specifications
n231    <h2 id="Browser_compatibility">n232    <h2 id="Browser_compatibility" name="Browser_compatibility">
t329    <p>t
330      &nbsp;
331    </p>

Back to History