第 n 个子选择器的 SASS 编译错误答案

【问题标题】：SASS compilation error with nth-child selector第 n 个子选择器的 SASS 编译错误
【发布时间】：2013-01-07 09:01:26
【问题描述】：

所以我在这里做了一些研究，但无法找到答案，所以希望这里有人可以帮助我......

我有以下 SASS 代码

$column: 7;

table
{
  th:nth-child($column) 
  {
    // This does NOT compile
  } 
  th:nth-child(7) 
  {
    // This does compile
  }
}

为什么将第 n 个子选择器与变量结合使用在 SASS 中无法编译？是否有任何替代方法可以将 dynamic 值与 nth-child 选择器一起使用？

【问题讨论】：

【解决方案1】：

当与选择器一起使用时，变量必须是interpolated（例如，作为函数伪类的参数）。在您的情况下，语法应如下所示：

$column: 7;

table
{
  th:nth-child(#{$column})
  {
    // ...
  }
}

【讨论】：