负面的CSSselect器
是否有某种“负面的”CSSselect器？
例如，当我在CSS中编写以下代码行时，具有类classname的标记中的所有input字段都将具有红色背景。
.classname input {background: red;} 如何select具有class classname标签外的所有input字段？
目前的浏览器CSS支持，你不能。
较新的浏览器现在支持它 – 请参阅Sam的答案了解更多信息。
（请参阅其他答案的CSS的替代品。）
如果在JavaScript / jQuery中可以接受，你可以这样做：
$j(':not(.classname)>input').css({background:'red'});
Mozilla支持否定式伪类 ：
:not(.classname) input {background: red;}
另见： http ： //developer.mozilla.org/en/Mozilla_CSS_support_chart
请注意，negation伪类位于“ select器级别3推荐标准”中 ，可用于最新版本的Firefox，Chrome和Safari（至less）。 下面的示例代码。
<html> <head> <title>Negation pseudo class</title> <style type="text/css"> div { border: 1px solid green; height: 10px; } div:not(#foo) { border: 1px solid red; } </style> </head> <body> <div id="foo"></div> <div id="bar"></div> <div id="foobar"></div> </body> </html>
难道你不是通过将“全局”背景设置为红色，然后使用类名来改变其他的？
input { background: red; } .classname input { background: white; }
我会这样做
input { /* styles outside of .classname */ } .classname input { /* styles inside of .classname, overriding above */ }
没有办法select与CSS匹配的元素的父母。 你将不得不使用JavaScript来select它们。
从你的问题，我假设你有标记，看起来或多或less像这样：
<form class="formclassname"> <div class="classname"> <input /> <!-- Your rule matches this --> <input /> <!-- Your rule matches this --> </div> <input /> <!-- You want to select this? --> <input /> <!-- You want to select this? --> </form>
一种select是将一个类添加到一个更高的元素中，比如说<form> ，然后编写一个规则来设置表单的所有input。 IE：
.formclassname input { /* Some properties here... */ }
要么
.formclassname > input { /* Some properties here... */ }
如果你想根据它们不在具有特定类的元素内select它们，那么不用运用JavaScript就可以了。
我认为最接近你能得到的只是一个声明只影响直系后裔
这个代码例如只会影响input字段直接在div类与“maincontent”
div.maincontent > input { // do something }
input有点烦人，因为与大多数其他html元素不同，并不一定会将所有css属性重置为默认值。
如果样式是非关键的（即很好有，但不影响function），我会使用jQuery来获取所有input数组，检查他们的父母，然后只在外部的那些div上执行样式。 就像是：
$('input').each(function() { if($(this).closest('.classname') == false) { // apply css styles } });
（顺便说一句，我不是jQuery的专家，所以上面可能会有一些错误，但原则上这样的事情应该工作）
