0

我想知道您是否有两个类标识符，它们是否都影响了它们之间的代码，或者是否发生了其他事情。示例代码：

.
.
.
<div class='class1'>
<div class='class2'>
<p>Example statement</p>
</div>
</div>

CSS：

.class1 {
           margin-right: 10px;
}

.class2 {
           margin-left: 10px;
}

这样会不会使文本具有 10px 的左右边距？任何帮助，将不胜感激。

4

2 回答 2

1

不，只有应用于该元素的类用于选择器。

但是，使用您的示例 HTML，您可以指定只需要作为 class1 子级的 class2 元素：

.class1 > .class2 {
  margin-left: 10px;
}

或 class2 的元素，它们是class1 的后代：

.class1 .class2 {
  margin-left: 10px;
}

可以在此处找到有关差异的信息：http: //www.w3.org/TR/CSS2/selector.html#descendant-selectors

为了使段落具有左右边距，您可以使用以下内容：

.class1 p {
  margin-right: 10px;
}

.class2 p {
  margin-left: 10px;
}

第一个说作为 class1 元素的后代的段落应该有右边距，第二个将左边距应用于作为 class2 的后代的段落。由于您示例中的段落符合这两个标准，因此将应用两种格式。

于 2012-10-15T03:08:32.107 回答
1

这完全取决于您应用的样式类型。如果这两种 div 样式是 class1 上的 font-family 和 class2 上的 font-size ，那么是的，文本将继承它们。边距是仅应用于其指定的实际元素的其中之一（尽管文本将适合这些 div 并且本质上将具有 10px 的左右边距，因为 div 包含将其推入其自己的边距内的文本。 )

CSS 也有一个特定的应用顺序，所以假设这两个 div 的颜色属性设置为不同的颜色。文本将获得 class2 的颜色，因为它是在 CSS 中读取的最后一行，并且会覆盖在 class1 中编写的任何冲突的内容。

有很多事情会影响这一点，例如它是 id 还是类选择器，是否内联等等。这里有一篇文章来解释具体的顺序。http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/

这是一篇关于继承的文章，这是您的实际问题。http://www.webdesignfromscratch.com/html-css/css-inheritance-cascade/

于 2012-10-15T03:49:50.950 回答