Функција тракасте јединице - ЦСС-трикови

Anonim

Постоји велика збрка око начина рада јединица у Сасу. Ипак, раде тачно онако како раде у стварном животу. Ако желите уклонити јединицу вредности, морате је поделити са 1 јединицом. На пример, да бисте уклонили cmјединицу од 42cm, морате је поделити са 1cm. Потпуно исто делује у Сасу.

$length: 42px; $value: $length / 1px; // -> 42

Али шта ако не знате јединицу која се користи? Рецимо да то може бити било шта, од пиксела до emили чак vwи ch. Тада морамо апстраховати логику у функцији:

/// 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; )

Израчун може изгледати чудно, али заправо има смисла. Да би имати 1у јединици $number, можемо вишеструко $numberје 0и тада додати 1.

Употреба

$length: 42px; $value: strip-unit($length); // -> 42