:disabled伪类用于选中禁用的表单元素并设置样式，如input:disabled{background-color:#f2f2f2;color:#999;cursor:not-allowed;}，适用于input、button、textarea、select等元素，配合disabled属性实现视觉提示，提升用户体验。
在 CSS 中，:disabled 是一个伪类选择器，用于选中处于禁用状态的表单元素。当一个表单元素（如 input、button、select 等）设置了 disabled 属性时，就可以通过 :disabled 来为其设置特定样式。
只需要在选择器后面加上 :disabled，即可为禁用状态的元素定义样式。例如：
input:disabled {
background-color: #f2f2f2;
color: #999;
border: 1px solid #ccc;
cursor: not-allowed;
}
这段代码会让所有被禁用的输入框背景变灰、文字变浅，并显示“禁止操作”的鼠标指针。
以下类型的表单元素支持 :disabled 伪类：
立即学习“前端免费学习笔记（深入）”；
示例：让禁用的按钮看起来更明显
button:disabled {
opacity: 0.6;
background-color: gray;
color: white;
cursor: default;
}
确保 HTML 元素确实含有 disabled 属性，CSS 才会生效。例如：
<input type="text" disabled> <button disabled>提交</button>
如果使用 JavaScript 动态启用/禁用元素，样式也会自动切换。
基本上就这些，不复杂但容易忽略细节。正确使用 :disabled 能提升表单的用户体验。
以上就是在css中如何用:disabled设置禁用状态的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
521
收藏
