条带单元功能-CSDN博客

在Sass中，单元的工作方式存在很多混乱。但是，它们的工作原理与现实生活完全相同。如果要删除值的单位，则必须将其除以1单位。例如，要删除42cm的cm单位，必须将其除以1cm 。它在Sass中的工作原理完全相同。

$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

翻译自: https://css-tricks.com/snippets/sass/strip-unit-function/