Question

我如何只得到calc的结果？

@winh: `$(window).height()`;
@re: calc(~'@{winh}px - 125px');

.lgrid(@width, @height) {
    height: ~"@{re} * 21.25% * @{height}" !important;
}

我的file.less

的结果

height: calc(675px - 125px) * 21.25% * 4 !important;

我用

尝试另一种方式

height: calc(~"@{re} * 21.25% * @{height}") !important;

但我有多个calc

calc(calc(675px - 125px) * 21.25% * 4) !important;

但它不适用于我的浏览器（chrome）。我如何计算这个？

Answer 1

如果你真的想使用css calc()函数作为最终计算器，那么你需要你的LESS代码是这样的：

height: ~"calc(@{re} * calc(21.25% * @{height}))" !important;

像这样制作css：

height: calc(calc(601px - 125px) * calc(21.25% * 4)) !important;

但是最好在LESS中进行所有计算，这是因为目前bugginess具有挑战性，所以真的需要全部在javascript中。也许更像是这样的事情：

@winh: `$(window).height()`;

.lgrid(@width, @height) {
  @calcHeight: `function(){return (@{winh} - 125) * (.2125 * @{height})}()`;
  height: ~"@{calcHeight}px" !important;
}

这假设最终结果是像素。

如何在LESS上计算多个calc（）？

1 个答案: