我有一个带有一堆规则的 CSS。我发现这些规则与我的应用程序的其他部分冲突。解决方案是使这些规则仅对特定 id 的后代(直系或非直系)有效:
<div id="thisOne">
<!-- the CSS rules should be active ONLY here -->
</div>
#thisOne p { color: red; }
但是,如果在 CSS 文件中的所有规则(数十个!)之前都使用 #thisOne
选择器,那将是非常丑陋的。有没有更好的办法?
最佳答案
我使用 Less, a CSS pre-processor帮助处理这些事情。我还使用一个名为 Crunch 的软件.但是,它可以从 here 下载。 .
为了让您了解其工作原理,让我们举个例子。
在 less 下(编译前)
#thisOne {
p {
color:red;
}
}
然后您可以根据需要添加到规则中。即:
#thisOne {
width:300px;
margin-left:50px;
h1 {
font-weight:lighter;
color:blue;
}
p {
color:red;
}
}
您可以做的远不止这些。一探究竟。我已经皈依了。
关于css - 使 CSS 文件中的所有规则仅适用于 id 的后代,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21856069/