css calc-用小数点后两位小数四舍五入 [英] css calc - round down with two decimal cases

问题描述

我有以下情况:

div {
    width: calc((100% / 11) - 9.09px);
}

在上下文中，在使用Sass的数学中生成了 100％ = 1440px和 9.09px .

结果是:94.55px，因为calc函数向上取整，但是我需要94.54px(向下取整).

如何舍入到最接近的百分之一?

#Edit:示例.

解决方案

不幸的是，CSS中没有一种原生的方法来舍入(或ceil/floor)数字.

但是—您提到您正在使用Sass.我找到了一个小型Sass库，该库可以将数字进行舍入，舍入和舍入到指定的精度./p>

例如，如果您有一个94.546，则可以使用decimal-floor(94.546, 2)，它会返回94.54.

不幸的是，如果您必须使用calc()来通过CSS快速进行计算，这可能无济于事.但是，如果您可以预先计算width并使用Sass对其进行下陷，则将满足您的需求.可能的解决方案是使用@media查询作为设置断点并在Sass预处理中使用这些断点的方法.

I have the following situation:

div {
    width: calc((100% / 11) - 9.09px);
}

In the context, 100% = 1440px, and 9.09px is generated in mathematics with sass.

The results is: 94.55px, because the calc function rounds up, but I need 94.54px (round down).

How can I round down to the nearest hundredths place?

#Edit: example.

解决方案

Unfortunately, there is not a native way in CSS to round (or ceil/floor) numbers.

However — you mentioned you are using Sass. I found a small Sass library that can round, floor, and ceil numbers to a specified precision.

For example, if you had a had 94.546 you could use decimal-floor(94.546, 2) which would return 94.54.

Unfortunately, this might not help if you have to use calc() to calculate on the fly with CSS. However, if you can pre-calculate the width and floor it with Sass it would fit your needs. A possible solution could be using @media queries as a way to set breakpoints and use those breakpoints in your Sass preprocessing.

这篇关于css calc-用小数点后两位小数四舍五入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！