如何从 SASS 中的颜色列表中获取第 n 个值？答案

【问题标题】：How to get nth value from color list in SASS?如何从 SASS 中的颜色列表中获取第 n 个值？
【发布时间】：2016-04-09 12:31:04
【问题描述】：

我有一个颜色列表，我需要从列表中获取第 n 个值。我尝试了下面的代码来获取颜色值

$grad: #000000, #ffffff;
$first: nth($grad, 1);
$second: nth($grad, 2);

但它不起作用。有什么我错过的吗？是否有任何内置函数支持从颜色列表中获取颜色（所有支持的格式，如 hexa、rgb、rgba、hsl 等）？

【问题讨论】：

查看此参考：stackoverflow.com/questions/20499850/sass-nth-child-nesting
所以我为你测试了这个，它似乎工作正常。有 2 种颜色分配给 $grad：#000000（黑色），#ffffff（白色）。 $first 是黑色的，$second 是白色的。

标签： css sass

【解决方案1】：

我发现问题是由于mixin中的参数。如果我设置多值参数 ($list...)，它不会从列表中获取第 n 个值。

@mixin list($list...){
  @if($list == none){
    .none{
      color: black;
    }
  }
  @else{
    $n: nth($list, 1);
    .color-#{$n}{
       color: $n;
    }
  }
}

$lis: red, blue;
@include list(none);
@include list($lis);

如果我从 mixin 参数中删除 (...) ，它可以正常工作。这可能是个问题

【讨论】：

您提供的代码不包含minimal reproducible example，使得这个答案在上下文中完全没有意义。这个问题对未来的访问者绝对没有价值，您应该删除它而不是发布对任何人都没有帮助的答案。