Want to share your CSS expertise with others? Apply to the MDN Fellowship by April 1! http://mzl.la/MDNFellowship

mozilla

Revision 41467 of :default

  • Revision slug: CSS/:default
  • Revision title: :default
  • Revision id: 41467
  • Created:
  • Creator: Miken32
  • Is current revision? No
  • Comment no wording changes

Revision Content

{{ CSSRef() }} {{ Fx_minversion_header("3") }}

Summary

The :default selector is used to identify a user interface element that is the default among a group of similar elements.

For example, the default button in a set of buttons would have this pseudo-class applied to it.

User interface elements that permit multiple selection may have multiple defaults set in order to initially appear with multiple items selected.

Syntax

:default { style properties }

Examples

:default
{
    background-color: lime;
}

...where...

 <form method="get">
  <p><input type="submit" id="submit1"></p>
  <p><input type="submit" id="submit2"></p>
  <p><input type="reset"></p>
 </form>

This example causes the background color to be lime for the default submit button in the form.

Specification

{{ languages( { "es": "es/CSS/:default", "ja": "ja/CSS/:default", "fr": "fr/CSS/:default" } ) }}

Revision Source

<p>{{ CSSRef() }} {{ Fx_minversion_header("3") }}</p>
<h3 name="Summary">Summary</h3>
<p>The <code>:default</code> selector is used to identify a user interface element that is the default among a group of similar elements.</p>
<p>For example, the default button in a set of buttons would have this pseudo-class applied to it.</p>
<p>User interface elements that permit multiple selection may have multiple defaults set in order to initially appear with multiple items selected.</p>
<h3 name="Syntax">Syntax</h3>
<pre class="eval">:default { <em>style properties</em> }
</pre>
<h3 name="Examples">Examples</h3>
<pre class="brush: css">:default
{
    background-color: lime;
}
</pre>
<p>...where...</p>
<pre class="brush: html"> &lt;form method="get"&gt;
  &lt;p&gt;&lt;input type="submit" id="submit1"&gt;&lt;/p&gt;
  &lt;p&gt;&lt;input type="submit" id="submit2"&gt;&lt;/p&gt;
  &lt;p&gt;&lt;input type="reset"&gt;&lt;/p&gt;
 &lt;/form&gt;
</pre>
<p>This example causes the background color to be <code>lime</code> for the default submit button in the form.</p>
<h3 name="Specification">Specification</h3>
<ul> <li><a class="external" href="http://www.w3.org/TR/css3-ui/#pseudo-default">CSS3 Basic User Interface Module: :default</a></li> <li><a class="external" href="http://www.whatwg.org/specs/web-forms/current-work/#enter-submit">Web Forms 2.0: Relation to CSS selectors</a></li>
</ul>

<p>{{ languages( { "es": "es/CSS/:default", "ja": "ja/CSS/:default", "fr": "fr/CSS/:default" } ) }}</p>
Revert to this revision