Es gibt viel Verwirrung darüber, wie Einheiten in Sass arbeiten. Sie arbeiten jedoch genauso wie im wirklichen Leben. Wenn Sie die Werteinheit entfernen möchten, müssen Sie sie durch 1 Einheit teilen. Um beispielsweise die cm
Einheit von zu entfernen 42cm
, müssen Sie sie durch dividieren 1cm
. In Sass funktioniert es genauso.
$length: 42px; $value: $length / 1px; // -> 42
Aber was ist, wenn Sie das verwendete Gerät nicht kennen? Nehmen wir an, es könnte alles sein, von Pixeln bis em
oder sogar vw
und ch
. Dann müssen wir die Logik in einer Funktion abstrahieren:
/// 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; )
Die Berechnung mag seltsam aussehen, macht aber tatsächlich Sinn. Um zu haben , 1
der Einheit $number
, können wir mehrfach $number
durch 0
und fügen Sie dann 1
.
Verwendung
$length: 42px; $value: strip-unit($length); // -> 42