用于<input type =“？”的CSS选择器

Question

有没有什么方法可以根据CSS的类型来定位所有输入？我有一个禁用的类，我使用各种禁用的表单元素，我设置文本框的背景颜色，但我不希望我的复选框获得该颜色。

我知道我可以用单独的类来做到这一点，但我宁愿使用CSS，如果可能的话。我敢肯定，我可以在JavaScript中设置它，但是再次寻找CSS。

我针对的是IE7 +。所以我不认为我可以使用CSS3。

编辑

随着CSS3我将能够做这样的事情？

INPUT[type='text']:disabled这将是更好的摆脱我干脆类的......

编辑

好感谢您的帮助！因此，这里是它修改已无需设置任何类，当我开始这个问题我从来没有想过这是可能的禁用的所有文本框和领域选择...

INPUT[disabled][type='text'], TEXTAREA[disabled] 
{ 
    background-color: Silver; 
} 

这个作品在IE7

Answer 1

是。IE7 +支持属性选择：

input[type=radio] 
input[type^=ra] 
input[type*=d] 
input[type$=io] 

与包含一个值，它等于，开头，包含或具有一定的值结束的属性类型元素的输入。

其他安全（IE7 +）选择是：

• 父>子有：p > span { font-weight: bold; }
• 由〜元素在之前是：span ~ span { color: blue; }

这对于​​将有效地为您提供：

<p> 
    <span style="font-weight: bold;"> 
    <span style="font-weight: bold; color: blue;"> 
</p> 

毛皮它读： Browser CSS compatibility on quirksmode.com

我很惊讶，其他人都认为它不能做。 CSS属性选择器已经有一段时间了。我想是时候清理我们的.css文件了。

Answer 2

对不起， 最简洁的答案是不。 CSS（2.1）只会标记DOM的元素，而不是它们的属性。你必须为每个输入应用一个特定的类。

Bummer我知道，因为那会非常有用。

我知道你说过你更喜欢CSS over JavaScript，但你仍然应该考虑使用jQuery。它为基于属性的DOM元素添加样式提供了一种非常干净优雅的方式。

Answer 3

你可以用jQuery做到这一点。使用它们的选择器，您可以按属性（如类型）进行选择。然而，这确实需要你的用户打开Javascript和一个额外的文件下载，但如果它的工作...

Answer 4

可悲的是，其他海报是正确的，你 ...实际上通过kRON，你确定你的IE7和严格的doc，但我们大多数人与IE6的要求都减少到JS或类参考为此，但它是一个CSS2属性，只有一个没有足够的支持来自IE^h^h浏览器。

出于完整性，类型选择器（类似于xpath）的形式为[attribute=value]，但存在许多有趣的变体。它将是相当强大的，当它是可用的，好东西保持在你的头IE8。

• w3 reference

• browser support reference