CSS :disabled selector is used to select and style disabled elements on a page. An element is treated as a disabled element if it has the disabled attribute. This attribute can be present in two ways: disabled=”disabled” or simply disabled.
The :disabled selector mostly works on the form elements like the buttons, inputs, checkboxes, textareas, etc.
The :disabled selector in the following example sets a lightgrey background to those inputs that have the disabled attribute:
Example:
input:disabled{
background: lightgrey;
}
You can also use the :disabled selector to select and style the disabled options of a dropdown. See this example:
Example:
option:disabled{
background-color: yellow;
}
CSS Syntax
The syntax of the :disabled selector is as follows:
:disabled{
CSS Styles;
}
Browser Support
The number in each cell of the table specifies the first version of the browser that fully supports the :disabled selector.
| Selector | |||||
| :disabled | 4.0 | 9.0 | 3.5 | 3.2 | 9.6 |
