角度编译.less正在以百分比计算像素：'calc（100％ - 26px）'到'calc（76％）[重复]

Question

我在 .less 文件中有以下 css 声明：

.qb-select-content {
    width: calc(100% - 26px);
    float: left;
}

当我编译这段代码时，angular-cli 将width: calc(100% - 26px); 转换为width: calc(76%)。

任何人都可以解释为什么会发生这种情况以及如何防止这种行为？

Answer 1

你可以逃避你的声明（注意~波浪号）：

.qb-select-content {
    width: calc(~100% - 26px);
}

上面会编译后输出：

.qb-select-content {
    width: calc(100% - 26px);
}

请记住，不是 angular-cli，而是您的 LESS 编译器在做这件事

或者，您可以研究插值，这在其他情况下也是一个非常有用的功能：https://github.com/SomMeri/less4j/wiki/Less-Language-String-Interpolation