首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

:enabled

:enabledCSS伪类表示任何可启用的元素。如果元素可以被激活(例如选择,点击或接受文本输入)或接受焦点,则该元素被认为是enabled。元素也有一个不能被激活或接受焦点的禁用状态。

代码语言:javascript
复制
/* Selects any  enabled element */
input:enabled {
  color: #22AA22;
}

语法

代码语言:javascript
复制
:enabled

实例

以下将使文本颜色在启用时为中绿色,禁用时为灰色。这允许向用户反馈哪些元素是可交互的。

下面的HTML...

代码语言:javascript
复制
<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一起使用...

代码语言:javascript
复制
input:enabled {
  color: #22AA22;
}

input:disabled {
  color: #D9D9D9;
}

...结果为:

注意,按钮上的文本颜色也是绿色的,因为按钮也是处于启用状态的。

规范

Specification

Status

Comment

HTML Living StandardThe definition of ':enabled' in that specification.

Living Standard

No change.

HTML5The definition of ':enabled' in that specification.

Recommendation

Defines the semantic regarding HTML and forms.

Selectors Level 4The definition of ':enabled' in that specification.

Working Draft

No change.

CSS Basic User Interface Module Level 3The definition of ':enabled' in that specification.

Candidate Recommendation

Link to Selectors Level 3.

Selectors Level 3The definition of ':enabled' in that specification.

Recommendation

Defines the pseudo-class, but not the associated semantic.

浏览器兼容性

Feature

Chrome

Edge

Firefox (Gecko)

Internet Explorer

Opera

Safari

Basic support

1.0

(Yes)

1.0 (1.7 or earlier)

9.0

9.0

3.1

Feature

Android

Edge

Firefox Mobile (Gecko)

IE Mobile

Opera Mobile

Safari Mobile

Basic support

2.1

(Yes)

1.0 (1)

9.0

9.5

3.1

扫码关注腾讯云开发者

领取腾讯云代金券

http://www.vxiaotou.com