SASS 可以计算一个值和下一个整数之间的差吗？答案

【问题标题】：Can SASS calculate the difference between a value and the next whole number?SASS 可以计算一个值和下一个整数之间的差吗？
【发布时间】：2017-08-24 13:40:19
【问题描述】：

我有一个 SASS 混合。目前 $line-height 需要是完整的数字是 1、2 等，但不是 1.4、2.2 等。

@mixin text-style($line-height) {
  line-height: $line-height rem;
}

我需要扩展它，这样您就不必使用整数。但为了做到这一点，我需要添加填充以保持垂直节奏。填充值是 $line-height 和下一个整数之间的差。

因此，如果 $line-height 为 1、2 等，则不添加任何填充。

如果 $line-height 为 1.5，则需要添加 0.5 填充。

如果 $line-height 为 1.1，则需要添加 0.9 填充。

SASS 可以做到这一点吗？

【问题讨论】：

SASS 知道 floor/ceil 等数学函数，sass-lang.com/documentation/Sass/Script/Functions.html
... 使用这些函数，您可以像这样计算差异$padding: ceil($line-height) - $line-height;

标签： sass

【解决方案1】：

您可以添加另一个 mixin，它将相同的输入 $line-height 作为参数并使用 Marvin 在他的评论中写的逻辑：

@mixin add-padding($line-height) {
  $padding-to-add: ceil($line-height) - $line-height;
  padding: $padding-to-add;
}

现在您可以在样式中使用它，如下所示：

.selector {
  @include add-padding(2.4rem);
}

【讨论】：