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

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;}