css - 可以在 sass 中转换 translateXY 混合函数

Question

您好，我正在为 translateX 和 translateY 使用 mixin 函数，并且只为值 X 和 Y 创建一个函数，这是可能的或不可能的，请帮助在 Adavance 中表示感谢。

示例 1 是可能的，因为只有一个值通过，但另一个示例是可能的，或者没有任何其他想法在 SASS 中的一个函数中一次传递两个值？

示例-1

@mixin translateX($value) {
    -webkit-transform: translateX($value);
    -moz-transform: translateX($value);
    -ms-transform: translateX($value);
    transform: translateX($value);
}

示例 2

@mixin translateXY($value1, $value2) {
    -webkit-transform: translateXY($value1, $value2);
    -moz-transform: translateXY($value1, $value2);
    -ms-transform: translateXY($value1, $value2);
    transform: translateXY($value1, $value2);
}

标签： csssass

Answer 1

使用 sass 如下：

在@include参数中设置translate：@include translateXY(30%,50%);

并在@mixin 使用 中translate而不是translateXY

见小提琴

@mixin translateXY($value1, $value2) {
  .try{
    -webkit-transform: translate($value1, $value2);
    -moz-transform: translate($value1, $value2);
    -ms-transform: translate($value1, $value2);
    transform: translate($value1, $value2);
    }
}

@include translateXY(30%,50%);