The pseudo-class optionality is for form elements which are required or optional. Every input element which isn't :required is selected by :optional.
# Syntax
Copy
:required {
/* declarations */
}
:optional {
/* declarations */
}
# Example
Copy
:required {
border: 1px solid red;
}
:optional {
border: 1px solid gray;
}
The example adds a gray border to the optional input element and a red border to the required input element.
Try example in CodePen# Browser support
Platform
Chrome
Firefox
Safari
Edge
Internet Explorer
Opera
Desktop
Yes (8)
Yes (4)
Yes (5)
Yes (12)
Yes (10)
Yes (9.5)
Mobile
Yes (59)
Yes (4)
Yes (5)
Yes (12)
Yes (10)
Yes (10)
For future browser support information, also check out caniuse.com (Optionality pseudo-class).
# Usage statistics (Alexa Top 1,250,000 sites)
Due to an extreme price increase of our statistics provider the data collection was stopped in September 2018.
Please wait a moment, the comments start loading now...