我的元素中有一个非常简单的 style.less 文件，我正在使用 bootstrap一个干净的，响应式设计。所以我们开始吧:
@import "bootstrap/bootstrap.less";
@import "../css/jquery.vegas.css";
@import "../css/jquery.fancybox-1.3.4.css";
body {
padding-top: 60px;
padding-bottom: 40px;
}
@import "bootstrap/responsive.less";
现在，当我用 less 编译文件时，css 输出看起来很奇怪:
.container {
width: 940px;
margin-left: auto;
margin-right: auto;
*zoom: 1;
*zoom: 1;
width: 940px;
margin-left: auto;
margin-right: auto;
*zoom: 1;
*zoom: 1;
}
他只是把一切都加倍了!当我在我的 devolper 实例上工作时，我什至可以直接在浏览器中看到这种奇怪的行为。
这太奇怪太可怕了，有人知道为什么会这样吗？在从 bootstrap 导入的原始 less 文件中，所有内容都只定义一次。
最佳答案
这里有两个可能的解决方案。它们看起来都很明显，但我有时会忽略它们......
您是否在实际编译的 css 文件中看到重复的样式规则？或者您是否在 Firebug 或 Chrome 的开发者工具中看到了重复的规则？如果是第二个，请返回并确保您的 css 文件确实有重复项。
我在使用 LESS 时遇到了完全相同的重复问题，直到我意识到我在
<head>中两次包含了 css 之后我才弄清楚这个问题。 .这是一个愚蠢的错误，但我以前肯定犯过。
祝你好运。
关于css - 更少的编译器使一切翻倍，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9840474/