css - Sass:通过变量迭代链接选择器

Question

[I'm using the Sass Indented syntax though feel free to answer via SCSS]

这是循环的嵌套部分，我想在其中使用变量为每次迭代命名选择器:

$class: 2      
@for $i from 1 through 2
  @if $i == 1
    $sel: link
  @if $i == 2
    $sel: visited
  div #s-#{$class} ul
    &:nth-child(1) li
      &:nth-child(2) a
        &:$sel
          color: $cc

但是我得到:

"Syntax error: Invalid CSS after \"&:\": expected pseudoclass or pseudoelement, was \"$sel\"\A

(是的，我可以看出这是一个语法错误)

我正在寻找这样的输出:

div #s-2 ul:nth-child(1) li:nth-child(2) a:link {
  color: #cc0000;
}

div #s-2 ul:nth-child(1) li:nth-child(2) a:visited {
  color: #cc0000;
}

如果做这样的事情，Sass 有能力吗？如果是怎么办？

Answer 1

有一种更好(更明显)的方法可以实现我想要实现的目标(以 $i 从 1 到 1 为例):

$class: 2   
@for $i from 1 through 1
  div #s-#{$class} ul
    &:nth-child(1) li
      &:nth-child(2) a
        &:visited, &:link
          color: $cc

输出

div #s-2 ul:nth-child(1) li:nth-child(2) a:visited, div #s-2 ul:nth-child(1) li:nth-child(2) a:link {
  color: #cc0000;
}

虽然我对使用选择器作为变量的方法很好奇