我希望我的表单元素的标签是灰色的,如果输入被禁用,并且不能让它为文本输入工作.我已经尝试过以下内容：
input:disabled {
background:#dddddd;
}
input:disabled+label{color:#ccc;}
<input type='checkBox' disabled id='check1'>
<label for='check1'>Check</label>
<br>
<label for='text1'>Text</label>
<input type='text' id='text1' disabled>
样式适用于复选框标签,但不适用于文本标签.复选框是唯一可以通过CSS调整标签的输入类型吗？
我用Firefox测试
解决方法
根据@andi发表的评论：
input:disabled+labelmeans that the label is immediately AFTER the input. In your HTML,the label comes BEFORE the text input. (but there’s no CSS for “before”.)
他是对的但这不应该阻止我们能够用一点诡计来解决问题！
第一步：交换HTML元素的顺序,使< label>出现在< input>之后.这将允许样式规则按需要工作.
HTML
<input type="checkBox" id="check1" disabled="disabled"> <label for="check1">Check</label> <br> <input type="text" id="text1" disabled="disabled"> <label for="text1">Text</label> <br> <input type="checkBox" id="check2"> <label for="check2">Check</label> <br> <input type="text" id="text2"> <label for="text2">Text</label>
现在有趣的一点：使用CSS将文本输入的标签放在左侧：
CSS
input[type=text]+label {
float: left;
}
