css - 更少的编译器使一切翻倍

标签 css less

我的元素中有一个非常简单的 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 文件中,所有内容都只定义一次。

最佳答案

这里有两个可能的解决方案。它们看起来都很明显,但我有时会忽略它们......

  1. 您是否在实际编译的 css 文件中看到重复的样式规则?或者您是否在 Firebug 或 Chrome 的开发者工具中看到了重复的规则?如果是第二个,请返回并确保您的 css 文件确实有重复项。

  2. 我在使用 LESS 时遇到了完全相同的重复问题,直到我意识到我在 <head> 中两次包含了 css 之后我才弄清楚这个问题。 .这是一个愚蠢的错误,但我以前肯定犯过。

祝你好运。

关于css - 更少的编译器使一切翻倍,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9840474/

相关文章:

css - 在图像命令中居中文本链接

html - 如何在框内垂直放置正确尺寸的文本?

css - 使用 Angular JS 在 Twitter Bootstrap 中覆盖默认下拉菜单 css 的最佳方法

css - 如何将多个背景与 LESS 混合

windows - 在 Windows 上使用 node.js 在 PHPStorm 6 中设置一个 LESS 文件观察器?

jquery - 响应式样式和 jQuery .show()/.hide()

html - 在IE html上加载swf

webpack - 使用Modifyvars时如何减少热重载

css - 使用Sass/Less和Live CSS编辑

less - 限制混合值并在提供无效值时引发异常