我有以下内容
<body>
<div class="app" theme="light">
<div class="container">¨
<div class="wrapper">
<p class="text">something></p>
</div>
</div>
</div>
</body>
如何在 SASS 中定位特定的div，即使它只有几个div。我的意思是这样的。
p
color: red
[theme="dark"] &
color: green
我的意思是根据浅色/深色主题更改颜色。很多东西远远低于这个"应用程序"div。在 SASS 中，我认为以某种方式可以针对指定父div(即使它在大量标签后面(，但我无法弄清楚。
CSS 只会向下级联，但您可以使用：
.app
p
color: red
&[theme="dark"]
p
color: green
这样，您说div.app中的所有p元素都应该具有红色，但是如果div.app还具有值为dark的theme属性，则所有p的颜色都应该是绿色。
它将是：
div
color: red
&[theme="light"]
color: green
这样编译：
div {
color: red;
}
div[theme="light"] {
color: green;
}
看看它用普通的CSS做了什么。
div {
color: red;
}
div[theme="light"] {
color: green;
}<div class="app" theme="light">
<div class="container">¨
<div class="wrapper">
<p class="text">something</p>
</div>
</div>
</div>但它仍然呈现红色，即使在普通的 CSS 中，您显然需要增加 CSS 规范才能看到它工作。
它可能在这里：
div
color: red
&[theme="light"] div
color: green
普通的 CSS 演示
div {
color: red;
}
div[theme="light"] div {
color: green;
}<div class="app" theme="light">
<div class="container">¨
<div class="wrapper">
<p class="text">something</p>
</div>
</div>
</div>它可能无法回答您的麻烦，但至少，您应该知道它是如何工作的。