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

Css Sass:通过变量迭代链接选择器,css,compass-sass,sass,Css,Compass Sass,Sass,[我使用的是Sass缩进语法,尽管可以通过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 &am

[我使用的是Sass缩进语法,尽管可以通过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有能力吗?如果是这样,怎么做?

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

输出

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;
}
尽管我仍然对使用选择器作为变量的方法感到好奇

尝试使用
{$sel}

$class: 2
$cc: #cc0000
@for $i from 1 through 2
  $sel: ()
  @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
其中:

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; }
请注意,我必须在ifs之前初始化
$sel
,可能是因为否则它将保留在每个if的范围内。我昨天才学会了SASS,所以我很可能是错的

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; }