:disabled | CSS属性参考

09-03 次

标签 css教程 css属性伪类

CSS :disabled伪类选择器用于匹配被禁用的元素。

如果一个元素不能被激活（如选择、点击或接受文本输入）或获取焦点，则该元素处于被禁用状态。元素还有一个启用状态（enabled state），在启用状态下，元素可以被激活或获取焦点。

:disabled伪类选择器通常用于匹配按钮（<button>），select下拉框元素（<select>），input元素（<input>）和textarea元素（<textarea>）。当这些元素不能于用户进行交互时，就会被:disabled伪类选择器匹配。例如：

<input type="submit" disabled> 
<!-- 或者 -->
<input type="submit" disabled="disabled">

disabled属性是一个HTML5属性，它可以添加到以下一些元素中：<button>、<input>、<textarea>、<optgroup>、<option>和<fieldset>。当这些元素处于:disabled状态时，它们不能进行输入，点击和获取焦点。

示例代码

/* 为页面中所有被禁用的元素设置统一的样式 */
:disabled {
    background-color: #aaa;
    color: grey;
    border: 1px solid grey;
}
/* 为页面中被禁用的提交按钮设置样式 */
input[type="submit"]:disabled {
    background: #eee url(path/to/disabled.png) repeat-x;
    border: 1px solid grey;
}
/* 为被禁用的按钮的鼠标滑过状态设置鼠标样式 */
button:disabled:hover {
    cursor: not-allowed;
}