Question

我的表单有一个默认类，它定义了一些样式规则（scss格式），如下所示：

form.simple_form {

  $indent: 200px;   
  $length: 350px;
  .... 
}

在某些情况下，我需要将其他一组样式规则应用于我的表单，但我无法从中删除simple_form默认类（我的应用程序中的每个表单都是使用simple_form类创建的）。

幸运的是，我能够为每个表单设置其他类并使用 not css选择器我无法为每个表单应用默认表单类，如下所示：

form.simple_form:not(.signup, .login) {

  $indent: 200px;
  $length: 350px;
  ....
}

这是完美的，但由于某些原因，simple_form类不适用于所有表单，无论他们没有注册或登录类。< / p>

那么，为什么css选择器无法获得带有simple_form类的表单？更多，如果我在控制台中粘贴以下代码：

$('form.simple_form:not(.signup, .login)')

它成功返回表格。

请注意，我在rails和simple_form gem上使用ruby。

编辑：

这是我想要选择的表单的HTML：

<form accept-charset="UTF-8" action="/webinars" class="simple_form new_webinar" data-remote="true" data-type="js" data-validate="true" enctype="multipart/form-data" id="new_webinar" method="post" novalidate="novalidate">
....
</form>

这是我不想选择的HTML：

<form accept-charset="UTF-8" action="/sessions" class="simple_form login" method="post" novalidate="novalidate"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="✓"><input name="authenticity_token" type="hidden" value="kmDnV10Pv3eQz09U9QKTjfLQ7zweu6teALh4DDjYmfk="></div>
...
</form>

Answer 1

您遇到的问题似乎是在:not()选择器中使用逗号分隔的选择器列表，每个要删除的元素必须一次选择（“取消选择”？）（肯定在Chromium 25，Ubuntu 12.10）。

给出以下HTML：

<p>No classes</p>
<p class="test">With class 'test'</p>
<p class="test1">With class 'test1'</p>

以下作品：

p {
    color: #f00;
}

p:not(.test):not(.test1) {
    color: #000;
}

JS Fiddle demo

以下（与您的方法类似）不会：

p {
    color: #f00;
}

p:not(.test, .test1) {
    color: #000;
}

JS Fiddle demo

CSS not selector排除所有元素

1 个答案: