The :enabled
CSS pseudo-class represents any enabled element. An element is enabled if it can be activated (selected, clicked on, typed into, etc.) or accept focus. The element also has a disabled state, in which it can't be activated or accept focus.
/* Selects any enabled <input> */ input:enabled { color: blue; }
Syntax
:enabled
Examples
The following example makes the color of text and button <input>
s green when enabled, and gray when disabled. This helps the user understand which elements can be interacted with.
HTML
<form action="url_of_form"> <label for="FirstField">First field (enabled):</label> <input type="text" id="FirstField" value="Lorem"><br> <label for="SecondField">Second field (disabled):</label> <input type="text" id="SecondField" value="Ipsum" disabled="disabled"><br> <input type="button" value="Submit"> </form>
CSS
input:enabled { color: #2b2; } input:disabled { color: #aaa; }
Result
Specifications
Specification | Status | Comment |
---|---|---|
HTML Living Standard The definition of ':enabled' in that specification. |
Living Standard | No change. |
HTML5 The definition of ':enabled' in that specification. |
Recommendation | Defines the semantics for HTML and forms. |
Selectors Level 4 The definition of ':enabled' in that specification. |
Working Draft | No change. |
Selectors Level 3 The definition of ':enabled' in that specification. |
Recommendation | Defines the pseudo-class, but not the associated semantics. |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
:enabled | Chrome Full support 1 | Edge Full support 12 | Firefox Full support 1 | IE Full support 9 | Opera Full support 9 | Safari Full support 3.1 | WebView Android Full support 2 | Chrome Android Full support 18 | Firefox Android Full support 4 | Opera Android Full support 10.1 | Safari iOS Full support 3.1 | Samsung Internet Android Full support 1.0 |
Legend
- Full support
- Full support