:enabled
版本： CSS3
CSS 伪类
:enabled
表示任何被启用的（enabled）元素。如果一个元素能够被激活（如选择、点击或接受文本输入），或者能够获取焦点，则该元素是启用的。元素也有一个禁用的状态（disabled state），在被禁用时，元素不能被激活或获取焦点。
语法:
E : enabled { sRules }
匹配用户界面上处于可用状态的元素E。
浏览器支持
|
|
|
|
|
IE9+以及新版浏览器都支持
:enabled
|
||||
例子
下面的代码，当文本输入框处于启用状态时，输入框
<input>
的文本是绿色的，处于禁用状态时，输入框的文本则是灰色的。这样可以把元素是否可用反馈给用户。
//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="submit" value="submit" />
</form>
//CSS
input:enabled {color: #22aa22;}
input:disabled {color: #d9d9d9;}
需要注意的时提交按钮的文本颜色也是绿色的，因为按钮也是启用的。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
input[type="text"]:enabled{
background-color:pink;
}
</style>
</head>
<body>
<p>给选中的输入元素设置背景色</p>
用户名:<input type="text"><br>
密码:<input type="password"><br>
</body>
</html>
给选中的输入元素设置背景色
用户名:密码: