css - 有没有办法只为特定的包装器定义 CSS？

Question

我的意思是：例如，我有一个网页和一个包含应用程序的 div。页面有自己的样式，但我希望该应用程序有自己的样式（例如 twitter 引导样式）。那么有没有办法只为具体的包装器定义 CSS，以便应用程序的这些样式不会影响页面本身的样式。

当然我们总是可以写那种#wrapper .btn { // style }，但是同样的 twitter bootstrap 有 100KB 的样式，所以管理所有的样式会有点复杂。如果有类似的结构，那就完美了：

#wrapper {
     .btn { //style }
     .btn-group { // style }
}

这相当于

#wrapper .btn { // style }
#wrapper .btn-group { // style }

我希望在 CSS 中有解决方案。提前致谢！

score 0 · Accepted Answer

Twitter Botstrap 使用较少的 css http://lesscss.org/它可以让你完全按照你提到的那样做：

#wrapper {
     .btn { //style }
     .btn-group { // style }
}

它是这样写的，然后编译成传统的 css。根据您使用的框架/语言（.net、php），有特定于它们的插件。我们使用 dot.less 和 bootstrap，效果很好。

score 0 · Accepted Answer

不是纯 CSS。您需要使用 CSS 预处理器。其中有一些，它们都支持这种嵌套样式。

以下是一些最受欢迎的：

还有范围样式，但目前浏览支持很差。

2 回答 2