Sass（SCSS）-如何添加到类中的单个值

我想在元素周围的填充中添加2px。所以

填充：10px 14px
将成为
填充：14px 18px。我怎样才能做到这一点

希望有比（psuedo代码）更优雅的解决方案：

肯定有更好的方法吗？
事实上，你可以用很多方法来写。与您的代码类似的解决方案可以是：

$vertical-padding: 14px;
$horizontal-padding: 10px;

.normal-padding {
  padding: $vertical-padding $horizontal-padding;
}

.normal-padding {
  $extra: 2px;
  padding: #{$vertical-padding + $extra} #{$horizontal-padding + $extra};
}

一种更为动态的方式（如果只有这两种变体，则不太有用）：

您甚至可以更改上面的代码，以保留
$vertical padding
和
$horizontal padding
变量。正如我所说，有很多方法可以做到这一点。
只是为了好玩。您可以使用：


div{
边框：1px实心；
}
：根{
/*声明全局变量*/
--padding-x:10px；
--填充y:10px；
}
.软垫{
填充：var（--padding-y）var（--padding-x）；
}
.额外的{
/*为'extra'元素重新定义变量*/
--padding-x:30px；
--填充y:30px；
}

这太棒了！我一直想研究自定义属性，这是一个很好的切入点。谢谢伟大的是的，在将来我可能需要把这个维度变成一个变量，这样它才能完美地工作。非常感谢。
$vertical-padding: 14px;
$horizontal-padding: 10px;

.normal-padding {
  padding: $vertical-padding $horizontal-padding;
}

.normal-padding {
  $extra: 2px;
  padding: #{$vertical-padding + $extra} #{$horizontal-padding + $extra};
}

@mixin padding($extra : 0) {
  padding: #{14 + $extra}px #{10 + $extra}px;
}

.normal-padding {
  @include padding;
}

.extra-padding {
  @include padding(2);
}