在Sass中舍入数字并调整小数位数

Question

是他们在sass中改变发生舍入的数字的方法,我想停止将这样的数字舍入2.0242914979757085%到这个2.024%.我想调整输出css中的小数位数

Answer 1

没有任何额外功能的快速选项是将数字乘以1000,然后将其四舍五入,然后除以1000.

round($percent * 1000) / 1000;

Answer 2

从SASS更改日志:

现在可以使用--precision命令行选项设置Sass中数字的数字精度.此外,现在可以通过将Sass :: Script :: Number.precision设置为整数(默认为3)来更改Sass输出中的默认精度位数.由于现在可以更改此值,因此不推荐使用Sass :: Script :: Number中的PRECISION常量.万一你在代码中使用它,你现在应该使用Sass :: Script :: Number.precision_factor.

这是在SASS 3.1.8中添加的.

Answer 3

您可以使用以下功能,这是Takeru Suzuki创建的功能的略微改进:

@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;
    }
    @if $digits > 0 {
        @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;
    }
}

输出:

decimal-round(0.333)    => 0
decimal-round(0.333, 1) => 0.3
decimal-round(0.333, 2) => 0.33
decimal-round(0.666)    => 1
decimal-round(0.666, 1) => 0.7
decimal-round(0.666, 2) => 0.67