如何使用LESS css计算基于百分比的保证金?

时间:2012-04-08 21:52:54

标签: css less

我正在使用流畅/响应式布局,基于基于960网格的photoshop文件。对于其中一个元素,当布局宽度为960px时,我想要一个9px的左边距。

我见过这样做的例子,计算9/960,来自0.009375,并设置:

margin-left: 0.009375%

但是我正在使用LESS css / LESS.app,它可以对变量进行数学运算并动态创建它们。我尝试过这些方法,但是他们犯了错误:

margin-left:9/960%;
margin-left:9/960\%;
margin-left:(9/960)%;
margin-left:{9/960}%;

我怎样才能自动对此进行数学计算?

澄清

如果我使用margin-left:9/960; LESS将编译但输出css为margin-left: 0.009375;,其中不包含百分号,因此浏览器不会呈现(AFAIK)。

1 个答案:

答案 0 :(得分:1)

简单地乘以100%

$ echo "*{width: (9/960)*100%;}" | .npm/less/1.3.0/package/bin/lessc -
* {
  width: 0.9375%;
}