我想在div中嵌套一个css框架，以便提供像这样的作用域命名空间:
.myframework {
@import url("myframework.css");
}
但是，框架对
和& lt; body>标记，因此上述代码将编译为:.myframework html { ... }
.myframework body { ... }
这不行。我可以手动更改任何这样的引用，但这样我就必须在每次更新框架时手动执行此操作。是否有一个等效的查找/替换在LESS中，我可以应用到@import语句，像这样:
/* psedudocode */
.myframework {
str_replace( ( @import url("myframework.css") ), 'html', '.myframework-html';
}
编译为:
.myframework .myframework-html { ... }
<html>
<body>
No framework styles applied here
<div class="myframework">
<div class="myframework-html">
<div class="myframework-body">
Framework styles are applied here
</div>
</div>
</div>
</body>
</html>
另外，我可能会使用一些正则表达式来确保只有html和body TAGS受到影响，而不是类名、url()路径等。
虽然不是在LESS中，但这可能是一个更好的解决方案:https://www.npmjs.com/package/grunt-css-selectors
这个grunt插件将在所有css选择器中添加前缀。foo，但是html/body选择器将被替换为。foo。这样，我就可以从LESS或SASS编译，然后分别运行prefix命令。