从SASS的百分比中减去像素数？

Question

我知道你可以在Sass / Scss中做一些简单的数学运算。但有没有办法从百分比中减去像素？例如：

$image-size: 200px;

.bio {
    width: 100% - $image-size;
}

Answer 1

您可以使用 calc() 功能获取所需内容。它是实验性的，但仍然是pretty good supported不同的浏览器。

使用 Sass ，您可以创建calc mixin，以便在更多具有-webkit和-moz前缀的浏览器版本上运行（不需要< em> Opera one）：

@mixin calc($key, $value) {
  #{$key}: -webkit-calc(#{$value});
  #{$key}: -moz-calc(#{$value});
  #{$key}: calc(#{$value});
}

并用以下内容称呼它：

.bio {
  @include calc("width", "100% - #{$image-size}");
}

Answer 2

我看不出它是如何工作的，事实是SASS不能神奇地知道你的盒子的大小。

现在，如果我得到你要做的事情，最好的解决方案是将.box的父宽度包装成变量，然后将你的图像宽度减去该变量 - 考虑100％宽度意味着它将得到100％的一定的宽度。