如何使CSS样式依赖于其父元素

我想知道是否可以根据主体ID的值定义元素的样式

这很难解释，但像这样的东西是理想的：

HTML:

我知道我能做到：

body#home a { /* code here */ }

但这变得非常重复

我将期待您的回复

---

Peter

ID应该是唯一的，因此

#home{…}

是可以接受的

然后，子元素和子元素将是：

#home .myClass { ... }

---

如果经常使用这种技术来重新设置页面的外观，则可以简单地更改主体上的ID或类。

如果使用CSS框架，如或

---

下面是关于如何用更少的资源实现这一点的建议。希望这能有所帮助。

实现您所说的目标的最佳方法是在站点上创建一个基本样式表

它们有：

标题中的

元素覆盖您选择的任何内容

或

---

每个页面都有一个不同的样式表。请注意，虽然CSS框架可以支持这样的嵌套样式，但要在CSS中保持模块化和干净的继承性，这应该是经过深思熟虑的。你最终可能弊大于利。特别是，要注意被称为初始规则的东西，如下所述：

初始规则：深度不要超过四级。

对标记所做的任何更改都需要反映到 Sass，反之亦然。这也意味着样式的范围是 生命对于那些元素和HTML结构来说是完整的 违背了“级联样式表”中“级联”部分的目的

如果您遵循这条路径，那么您还可以继续编写CSS 内联在你的HTML（请不要）

---

如果您对使用css预处理器感兴趣，可以使用Sass。也许你正在寻找这个：body#home a{/*code/}body#home p{/code/}body#profile a{/code/}body#profile p{/code*/}根据你的回答，阅读整个问题通常是有帮助的。我决定不遵循这条路线，而只是简单地重新构建我的样式表文件。感谢您的帮助：）是的，在某些情况下，嵌套样式实际上可能有助于提高效率和可维护性。。。不过，如果没有经过深思熟虑，那就是一罐虫子。好问题。

body#home a { /* code here */ }

#home .myClass { ... }