Использовать значение nth-child как переменную SASS Можно ли использовать значение nth-child как переменную SASS? Примеры использования: div:nth-child(n) { content: '#{$n}' } div:nth-child(n) { background: rgb(#{$n}, #{$n}, #{$n}); } Ответ 1 Я не думаю, что есть способ сделать именно это. Но вы можете использовать директиву @for для цикла через известное количество элементов: $elements: 15; @for $i from 0 to $elements { div:nth-child(#{$i}) { background: rgb($i, $i, $i); } } Ответ 2 Вы можете использовать такой микшинг: @mixin child($n) { &:nth-child(#{$n}){ background-color:rgb($n,$n,$n); } } div{ @include child(2); } Скомпилированный css выглядит так: div:nth-child(2) { background-color: #020202; } См. пример здесь
Ответ 1 Я не думаю, что есть способ сделать именно это. Но вы можете использовать директиву @for для цикла через известное количество элементов: $elements: 15; @for $i from 0 to $elements { div:nth-child(#{$i}) { background: rgb($i, $i, $i); } }
Ответ 2 Вы можете использовать такой микшинг: @mixin child($n) { &:nth-child(#{$n}){ background-color:rgb($n,$n,$n); } } div{ @include child(2); } Скомпилированный css выглядит так: div:nth-child(2) { background-color: #020202; } См. пример здесь