How do you strip the unit from any number in SASS?

问题

I know you can strip units from numbers in SASS when you know the unit before-hand like this:

$number: 16px;
$without-unit: 16px / 1px;
@warn $without-unit; // 16

But is it possible to strip the unit from a number without knowing what the unit is first?

@function strip-unit($number) {
  // magic code here...
}

@warn strip-unit(16px); // 16

回答1:

--

UPDATE: You should never actually need to use this function. Sass math is very smart about units, and I have never seen a use-case in which stripping units was a better option than simply using correct math to get what you need. See the Sass issue thread where this has been discussed at length.

It's a clever function, but if you ever feel like using it, there's probably a problem with your math. Don't fall back on this function. Fix your math instead.

--

You need to divide by 1 of the same unit. If you use unit(), you get a string instead of a number, but if you multiply by zero and add 1, you have what you need:

@function strip-units($number) {
  @return $number / ($number * 0 + 1);
}

That works. strip-units(13.48cm) will return 13.48.

回答2:

I think you'd have to add a custom Ruby function to strip the units (see the documentation on adding custom functions). It would look something like this, I think (warning, untested):

module Sass::Script::Functions
  def strip_units(num)
    assert_type num, :Number
    Sass::Script::Number.new(num.value)
  end
end

来源：https://stackoverflow.com/questions/12328259/how-do-you-strip-the-unit-from-any-number-in-sass