如何从父元素的样式定义一组子元素的样式？

Question

如何从父元素的样式定义一组子元素的样式属性值。

我想实现以下目标 -

<div style="style for the child <span> tags">
 <span>a</span>
 <div>b</div>
 <span>c</span>
 <div>d</div>
</div>

假设我想在子<span>标记中设置仅文本的颜色，而不是在子<div>标记中设置文本的颜色。在这里，我想知道如何在 内联和内部CSS 的情况下执行此操作。

我该怎么做？

Answer 1

你不能内联。

给你的主div一个id，让我们使用container。 css就像这样：

div#container span {
    styles for the spans inside the main div
}

当然，如果你有多个这样的容器div，请使用class而不是id。方法是一样的。

Answer 2

一种方式就是这样

div span {

/* styles */

}

或者如果您需要更具体到顶级div，请在其上添加一个id，然后将其作为目标

#top_level_div span {

/* styles */

}

Answer 3

您可以将类提供给父div，然后在css标记中访问其子节点。

.fooClass span{color:red;}