Sass for循环映射到CSS但未显示在浏览器中

我有一个sass for循环,我想用它来更改表格单元格的样式。它正在映射到我的CSS,但未显示在浏览器中。我的CSS样式表链接到了HTML,并且可以正常工作。谁能给我一些建议,为什么它不起作用?如果我手动粘贴代码,则可以正常工作。

SCSS:

@for $i from 6 through 11 {
        th:nth-child(#{$i}) {
            height: 30px;
            width: 150px;

            input {
                background-color: color(section);
                border: none;
                color: color(primary-text);
                font-size: 14px;
                font-family: 'Nunito', sans-serif;
            }
        }
    }

CSS:

table tr:nth-child(2) th:nth-child(6) {
  height: 30px;
  width: 150px;
}

table tr:nth-child(2) th:nth-child(6) input {
  background-color: #161616;
  border: none;
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-family: 'Nunito', sans-serif;
}

table tr:nth-child(2) th:nth-child(7) {
  height: 30px;
  width: 150px;
}

table tr:nth-child(2) th:nth-child(7) input {
  background-color: #161616;
  border: none;
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-family: 'Nunito', sans-serif;
}

table tr:nth-child(2) th:nth-child(8) {
  height: 30px;
  width: 150px;
}

table tr:nth-child(2) th:nth-child(8) input {
  background-color: #161616;
  border: none;
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-family: 'Nunito', sans-serif;
}

table tr:nth-child(2) th:nth-child(9) {
  height: 30px;
  width: 150px;
}

table tr:nth-child(2) th:nth-child(9) input {
  background-color: #161616;
  border: none;
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-family: 'Nunito', sans-serif;
}

table tr:nth-child(2) th:nth-child(10) {
  height: 30px;
  width: 150px;
}

table tr:nth-child(2) th:nth-child(10) input {
  background-color: #161616;
  border: none;
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-family: 'Nunito', sans-serif;
}

table tr:nth-child(2) th:nth-child(11) {
  height: 30px;
  width: 150px;
}

table tr:nth-child(2) th:nth-child(11) input {
  background-color: #161616;
  border: none;
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-family: 'Nunito', sans-serif;
}
评论