:disabled和:enabled是CSS中用于表单元素的伪类，分别选中禁用和启用状态的控件。:enabled匹配可交互元素，如未设置disabled属性的input、button等；:disabled则选中已禁用的表单元素，常用于灰化不可操作控件。两者互为反义，通过设置不同样式提升表单视觉反馈，仅对支持disabled属性的表单元素有效，普通标签如div、span不受影响。
在CSS中，:disabled 和 :enabled 是用于表单元素的伪类选择器，用来根据元素是否可交互来应用不同的样式。
:enabled 伪类
表示一个可以被用户操作的表单元素。默认情况下，大多数表单控件如输入框、按钮等都是启用状态。
- 适用于可以被点击、聚焦或输入内容的元素
- 常见于没有设置 disabled 属性的 input、button、select 等
- 例如：一个普通的文本输入框会匹配 :enabled
:disabled 伪类
选中当前处于禁用状态的表单元素。禁用的元素通常无法被点击、聚焦或提交。
- 元素设置了 disabled 属性后就会匹配此伪类
- 常用于灰化不可用控件，提示用户当前不能操作
- 例如： 就会被 :disabled 选中
实际使用示例
通过这两个伪类可以轻松控制启用和禁用状态下的外观：
立即学习“前端免费学习笔记（深入）”；
input:enabled {
background-color: #fff;
border: 1px solid #ccc;
}
input:disabled {
background-color: #f5f5f5;
color: #999;
border: 1px dashed #ddd;
}
基本上就这些。它们互为反义，配合使用能提升表单的视觉反馈效果，让用户更清楚哪些控件当前可用。注意只对支持 disabled 属性的元素有效，比如表单相关标签。普通 div 或 span 不受这两个伪类影响。
