如何影响特定 div id 和内部 div 中的所有 h2 标签答案

【问题标题】：How to affect all h2 tags inside a specific div id and with inner divs如何影响特定 div id 和内部 div 中的所有 h2 标签
【发布时间】：2022-12-12 11:07:11
【问题描述】：

我有一个棘手的问题，我想让我所有的 h2 标签都继承 CSS 样式。我不能在全球范围内这样做，因为它会影响我组件的某些 CSS 样式。为了实现这一点，我必须专门分离一个 CSS 文件。这是以下 html 输出：

<div id="center">
    <h2>Sample center h2</h2>
    <div id="secondDiv">
        <h2>Sample secondDiv h2</h2>
        <div id="thirdDiv">
             <h2>Sample thirdDiv h2</h2>
        </div>
    </div>
</div>

我在下面做了这个当前的解决方案：

#center h2 {
   text-align: center;
}

#center > div > h2 {
   text-align: center;
}

#center > div > div > h2 {
   text-align: center;
}

我认为这很乏味，并且示例内部 div 在我的实际应用程序中具有动态 ID。我想用一行 css 代码影响所有 h2 标签？谢谢！

【问题讨论】：

上面的第一个 CSS 规则将影响所有作为 'center' 后代的 'h2' 标签。您不需要任何更多规则。
您是否需要所有这些嵌套，因为某些内部 div 更改了您希望从顶部继承的设置？如果您制作可运行的 sn-p，我们将能够提供更多帮助。见stackoverflow.com/help/minimal-reproducible-example
@petern0691 我只尝试使用第一个 CSS 规则，但我不知道为什么它不影响内部 h2 标签。
@AHaworth 好吧，我会尝试创建一个 sn-p。
除了上面显示的内容之外，您一定在做其他事情，因为第一条规则对我有用。

标签： html css

【解决方案1】：

这个问题的答案是我写的第一个 CSS 规则。谢谢您的帮助！

#center h2 {
   text-align: center;
}

【讨论】：