Det är mycket förvirring kring hur enheter fungerar i Sass. Ändå fungerar de precis som de gör i verkliga livet. Om du vill ta bort värdenheten måste du dela den med 1 enhet. För att till exempel ta bort cm
enheten av 42cm
måste du dela den med 1cm
. Det fungerar exakt detsamma i Sass.
$length: 42px; $value: $length / 1px; // -> 42
Men tänk om du inte känner till enheten som används? Låt oss säga att det kan vara vad som helst, från pixlar till em
eller till vw
och med ch
. Då måste vi abstrahera logiken i en funktion:
/// 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; )
Beräkningen kan se udda ut men det är faktiskt vettigt. För att få 1
enheten av $number
kan vi multiplicera $number
med 0
och sedan lägga till 1
.
Användande
$length: 42px; $value: strip-unit($length); // -> 42