2

我有以下 Sass 规则：

$multiplier: 1/3*100;
.ratio_1x0-5{
    padding-bottom: 0.5%*$multiplier;
}

输出以下CSS：

.ratio_1x0-5{
    padding-bottom: 16.6666666667%
}

相反 - 我需要这个规则如下（小数精度并不重要 - 只有最后一个值是 6 - 而不是 7），这是为了解决子像素渲染问题。

.ratio_1x0-5{
    padding-bottom: 16.6666%
}

如果我使用 sass 'floor' 功能 - 它会将整个事情四舍五入到 '16%'。有没有办法在 Sass 中四舍五入到 x 位小数？使用 mixin 来做到这一点怎么样？我正在使用 libsass（s​​ass 3.2）。

调整“精度”不起作用 - 最后一个值仍然是“7”。仅更改精度只会截断小数位数 - 它不会像我需要的那样舍入最后一个小数位。

代码笔： http ://codepen.io/calumbrodie/pen/aOzVga

编辑：无论谁将此标记为重复 - 这是一个不同的问题，另一个问题是关于“精度”，而我明确解释了为什么这与“精度”无关。我真的不能说得更清楚了。

4

2 回答 2

1

Found the answer just after posting thanks to the following Gist:

https://gist.github.com/terkel/4373420

@function decimal-round ($number, $digits: 0, $mode: round) {
    $n: 1;
    // $number must be a number
    @if type-of($number) != number {
        @warn '#{ $number } is not a number.';
        @return $number;
    }
    // $digits must be a unitless number
    @if type-of($digits) != number {
        @warn '#{ $digits } is not a number.';
        @return $number;
    } @else if not unitless($digits) {
        @warn '#{ $digits } has a unit.';
        @return $number;
    }
    @for $i from 1 through $digits {
        $n: $n * 10;
    }
    @if $mode == round {
        @return round($number * $n) / $n;
    } @else if $mode == ceil {
        @return ceil($number * $n) / $n;
    } @else if $mode == floor {
        @return floor($number * $n) / $n;
    } @else {
        @warn '#{ $mode } is undefined keyword.';
        @return $number;
    }
}

Then use it as follows:

.ratio_1x0-5{
    padding-bottom: decimal-round(0.5%*$multiplier, 5, floor);
}
于 2015-04-27T16:33:06.190 回答
-1

使用 $sass-precision: x; 它会明确地告诉 sass 以小数位数四舍五入。

于 2015-04-27T16:29:59.157 回答