0

我正在尝试解决 CKEditor 中没有正确应用边距的错误。使用 Bootstrap，第一个跨度的边距被有效地忽略，因为它位于行之外。然而在 CKEditor 中，由于某种原因它位于行内，因此将最后一个跨度推到新行上，因为行内没有足够的空间。

解决此问题的一种简单方法是将第一个跨度的 margin-left 设置为 0，因此我最终将其添加到我的 content.css 文件中：

[class*="span"]:first-of-type {
    margin-left: 0px;
}

这很好用，只要所有跨度都相同，所有 div 或所有文章。但是，如果我有一篇文章和一篇文章，那么 CSS 似乎会将它们作为两种不同的第一种类型来选择，并将:first-of-type规则应用于它们。例如：

<div class="container">
    <div class="row">
        <article class="span6">
            ...some html text
        </article>
        <aside class="offset3 span3">
            ...some more html text
        </aside>
    </div>
</div>

当我只想将文章的 margin-left 设置为 0 时，article 和 side 都将它们的 margin-left 设置为 0。这只是一个示例，可以有任何可能的 div、articles 和 asides 组合想想，以及引导程序允许的任何数字。

经过短暂的谷歌后，我发现了这个问题，这似乎与我的问题相似。答案解释说:first-of-type实际上是对元素起作用，而不是类，这解释了我看到的行为。不幸的是，该答案中指定的解决方法对我不起作用，因为我试图从第一个 div 中删除一些 css，并保持其余部分完好无损。

是否有任何解决方法可以让我使用 来定位第一个元素[class*="span"]？失败了，CKEditor 和 Bootstrap 有没有其他已知的解决方案？

4

3 回答 3

2

为什么不只使用第n 个子选择器：

[class*="span"]:nth-child(1) {}

例子

于 2013-06-24T14:21:49.537 回答
0

您可以重置重置您的[class*=span]，然后检查是否有其他人跟随。 （无论它是首先出现还是在结构中的其他位置）。

如果是这种情况，还有其他[class*=span]在同一级别，您可以将它们设置回similar original value。

由于 [class*=span]已经被覆盖，需要用更强的选择器再次覆盖

[class*="span"] {
  color:green;
  margin-left:0;
  border:solid;
}
[class*="span"] ~ [class]
{
  margin-left: 20px;
  color:red;
}

http://codepen.io/gcyrillus/pen/nFixc

如果你链接它，codepen 会引导它。

于 2013-06-24T14:51:02.540 回答
0

正如您已经提到的，first-of-type对元素起作用，而不是选择器。因为article和aside都是您示例中的第一个类型，所以它们将应用该样式。

在我的脑海中，我认为没有办法完全解决你选择的困境，但是，如果我正确理解你的问题，我通常会通过为所有人定义一种风格[class*="span"]然后恢复/重新定义来解决它对于以下内容：

[class*="span"] { margin-left: 0px;}
[class*="span"] ~ [class*="span"] { margin-left: 10px; } /* Whatever the original is set to */
于 2013-06-24T14:17:29.590 回答