Există o mulțime de confuzie în legătură cu modul în care unitățile funcționează în Sass. Cu toate acestea, funcționează exact așa cum fac în viața reală. Dacă doriți să eliminați unitatea de valoare, trebuie să o împărțiți cu 1 unitate. De exemplu, pentru a elimina cm
unitatea de 42cm
, trebuie să o împărțiți 1cm
. Funcționează exact la fel în Sass.
$length: 42px; $value: $length / 1px; // -> 42
Dar dacă nu cunoașteți unitatea utilizată? Să em
presupunem că ar putea fi orice, de la pixeli la sau chiar vw
și ch
. Atunci trebuie să abstractizăm logica într-o funcție:
/// Remove the unit of a length /// @param (Number) $number - Number to remove unit from /// @return (Number) - Unitless number @function strip-unit($number) ( @if type-of($number) == 'number' and not unitless($number) ( @return $number / ($number * 0 + 1); ) @return $number; )
Calculul ar putea părea ciudat, dar are sens. Pentru a avea 1
unitatea de $number
, putem înmulți $number
cu 0
și apoi adăuga 1
.
Utilizare
$length: 42px; $value: strip-unit($length); // -> 42