Fijar un número a N dígitos - Trucos CSS

Tabla de contenido

Cuando se trata de números en JavaScript o cualquier otro lenguaje de programación, existe una forma de truncar un número después de los ndígitos. Desafortunadamente, no existe tal función en Sass. Aún así, los problemas de redondeo y precisión ocurren cuando se trata de sistemas de cuadrícula basados ​​en porcentajes, por ejemplo.

Aquí hay una implementación de Sass de toFixed():

/// toFixed() function in Sass /// @author Hugo Giraudel /// @param (Number) $float - Number to format /// @param (Number) $digits (2) - Number of digits to leave /// @return (Number) @function to-fixed($float, $digits: 2) ( $sass-precision: 5; @if $digits > $sass-precision ( @warn "Sass sets default precision to #($sass-precision) digits, and there is no way to change that for now." + "The returned number will have #($sass-precision) digits, even if you asked for `#($digits)`." + "See https://github.com/sass/sass/issues/1122 for further informations."; ) $pow: pow(10, $digits); @return round($float * $pow) / $pow; )

Tenga en cuenta que Sass tiene una precisión predeterminada de 5 dígitos y no hay forma de configurarlo a partir de hoy. Debido a esto, Sass no puede calcular un número con más de 5 dígitos, sin importar el número dado a la función como $digits.

Además, esta función requiere una powfunción que no es nativa de Sass (todavía). Existe en Compass, pero si no usa Compass o cualquier otra biblioteca que lo proporcione, es posible que necesite su propia powfunción. Afortunadamente, es bastante fácil de implementar:

/// Power function /// @param (Number) $x /// @param (Number) $n /// @return (Number) @function pow($x, $n) ( $ret: 1; @if $n >= 0 ( @for $i from 1 through $n ( $ret: $ret * $x; ) ) @else ( @for $i from $n to 0 ( $ret: $ret / $x; ) ) @return $ret; )

Articulos interesantes...