Css 我不知道'；I don’我不明白，我需要一些解释

我不熟悉mixins，我试着去理解这一点。你能给我解释一下这个吗？它有什么作用

@mixin _position($position, $args) {
  @each $dir in top, left, bottom, right {
    $i: index($args, $dir);

    @if $i {
      #{$dir}: nth($args, $i + 1);
    }
  }

  position: $position;
}

@mixin absolute($args) {
  @include _position(absolute, $args);
}

@mixin relative($args) {
  @include _position(relative, $args);
}

@mixin fixed($args) {
  @include _position(fixed, $args);
}

@mixin sizing($args, $prefix: "") {
  $width: if(length($args) == 2, nth($args, 1), $args);
  $height: if(length($args) == 2, nth($args, 2), $args);

  #{$prefix}width: $width;
  #{$prefix}height: $height;
}

---

我不明白用那种风格写它有什么意义，它实际上做了什么…

这些是带参数的sass@mixin，就像一个函数一样，mixin是一段可以重用的代码。 第一个方向上有一个循环方向：上、左、下、右：

@each $dir in top, left, bottom, right

$dir和$i只是局部变量。 index（$args，$dir）：返回列表中值的第一个索引（或null）：

当$i存在时，调用第n个函数。它获取列表中的$i+1项并将其放入$dir：

#{$dir}: nth($args, $i + 1);

在本次混音结束时，将应用混音位置

position: $position;

在这个代码段的其他混合中，第一个是使用@include调用的

---

Sass文档非常详细，您可以在那里阅读更多内容

这些是带有参数的sass@mixin，就像函数一样，mixin是一段可以重用的代码。 第一个方向上有一个循环方向：上、左、下、右：

@each $dir in top, left, bottom, right

$dir和$i只是局部变量。 index（$args，$dir）：返回列表中值的第一个索引（或null）：

当$i存在时，调用第n个函数。它获取列表中的$i+1项并将其放入$dir：

#{$dir}: nth($args, $i + 1);

在本次混音结束时，将应用混音位置

position: $position;

在这个代码段的其他混合中，第一个是使用@include调用的 Sass文档非常详细，您可以在那里阅读更多内容