Css SASS：在循环中附加类选择器

我想获得以下css：

.menu IMG { padding-left: 10px; }
.menu .submenu IMG { padding-left: 20px; }
.menu .submenu .submenu IMG { padding-left: 30px; }

因此，在每个循环中，应在选择器中添加“.submenu”，并更新填充

---

有没有办法用SASS实现这一点？

您可以这样做：

@for $i from 1 through 3 {
    $class: '.menu';

    @if $i > 1 {
        @for $j from 1 through $i - 1 {
            $class: $class + ' .submenu';
        }
    }
    $class: $class + ' IMG';
    #{$class} {
        padding-left: #{$i * 10px};
    }
}

---

您可以这样做：

@for $i from 1 through 3 {
    $class: '.menu';

    @if $i > 1 {
        @for $j from 1 through $i - 1 {
            $class: $class + ' .submenu';
        }
    }
    $class: $class + ' IMG';
    #{$class} {
        padding-left: #{$i * 10px};
    }
}

---

理想情况下，您希望使用一个if/else块来排除第一个

。子菜单
if
$i
是
<1
，从
0
@roberrt开始
$1
，这很好，但我可以简单地从0循环到2，所以嵌套for循环不会在第一次迭代时执行。更新了我的答案这不起作用，但设法在第一个条目中插入了两个子菜单
类。这是可行的：
@从0到5的$i{$class:'.menu'.@从0到$i的$i{@if$i<1{$class:$class}@else{$class:$class+'.submenu'；}}$$class:$class+'IMG'.{$class}{左填充：#{$i*10px}；}
@roberrt我没有料到sass会以负方向迭代。再次修复了我的代码，这次测试了它，感谢您理想地希望使用if/else块来排除第一个
。子菜单
if
$i
是
<1
，从
0
@roberrt开始
$1
，很好，但我可以简单地循环m 0到2，因此嵌套的for循环不会在第一次迭代时执行。更新了我的答案这不起作用，但不知何故，它设法在第一个条目中插入了两个子菜单

类。尽管如此：

@对于从0到5的$i{$class:'.menu'；对于从0到$i的$i{@if$i<1{$class:$class}@else{$class:$class+'.子菜单'；}}}$class:$class+'IMG'.{$class}{padding left:{$i*10px}；}}

@Roberrrt我没想到sass会以负方向迭代。再次修复了我的代码，这次测试了它，谢谢