:required

  • Revision slug: CSS/:required
  • Revision title: :required
  • Revision id: 45598
  • Created:
  • Creator: nimbupani
  • Is current revision? No
  • Comment 9 words added, 4 words removed

Revision Content

{{ CSSRef() }}{{ gecko_minversion_header("2.0") }}

Summary

The :required CSS pseudo-class is applied automatically to {{ HTMLElement("input") }} elements that have the {{ htmlattrxref("required", "input") }} attribute set on them. This allows forms to easily indicate which fields must have valid data before the form can be submitted.

You may use the {{ cssxref(":optional") }} pseudo-class to provide an appearance for optional form fields.

Examples

See {{ cssxref(":invalid") }} for an example.

Browser compatibility

Browser Lowest version
Internet Explorer ---
Firefox (Gecko) 4.0 (2.0)
Opera 9.5

Safari | Chrome | WebKit

5 | 8 | 534.10

Specifications

See also

  • {{ cssxref(":optional") }}
  • {{ cssxref(":invalid") }}
  • {{ cssxref(":valid") }}

Revision Source

<p>{{ CSSRef() }}{{ gecko_minversion_header("2.0") }}</p>
<h3>Summary</h3>
<p>The <code>:required</code> CSS pseudo-class is applied automatically to {{ HTMLElement("input") }} elements that have the {{ htmlattrxref("required", "input") }} attribute set on them. This allows forms to easily indicate which fields must have valid data before the form can be submitted.</p>
<p>You may use the {{ cssxref(":optional") }} pseudo-class to provide an appearance for optional form fields.</p>
<h3>Examples</h3>
<p>See {{ cssxref(":invalid") }} for an example.</p>
<h3>Browser compatibility</h3>
<table class="standard-table"> <tbody> <tr> <th>Browser</th> <th>Lowest version</th> </tr> <tr> <td>Internet Explorer</td> <td>---</td> </tr> <tr> <td>Firefox (Gecko)</td> <td>4.0 (2.0)</td> </tr> <tr> <td>Opera</td> <td>9.5</td> </tr> <tr> <td> <p>Safari | Chrome | WebKit</p> </td> <td> <p>5 | 8 | 534.10</p> </td> </tr> </tbody>
</table>
<h3>Specifications</h3>
<ul> <li><a class=" external" href="http://www.w3.org/TR/css3-ui/#pseudo-required-value" title="http://www.w3.org/TR/css3-ui/#pseudo-required-value">CSS 3 Basic User Interface Module</a></li>
</ul>
<h3>See also</h3>
<ul> <li>{{ cssxref(":optional") }}</li> <li>{{ cssxref(":invalid") }}</li> <li>{{ cssxref(":valid") }}</li>
</ul>
Revert to this revision