1

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

form.simple_form {

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

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

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

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

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

这是完美的工作，但由于某种原因，simple_form 类不适用于所有表单，无论它们没有注册或登录类。

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

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

它成功返回表单。

请注意，我正在使用 ruby​​ on rails 和 simple_form gem。

编辑：

这是我要选择的表单的 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>
4

1 回答 1

3

您遇到的问题似乎是在选择器中使用逗号分隔的选择器列表，: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 小提琴演示。

而以下（与您的方法类似）没有：

p {
    color: #f00;
}

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

JS 小提琴演示。

于 2013-06-08T09:19:52.063 回答