Директива @for выводит набор стилей заданное число раз. Для каждого повторения используется переменная-счётчик для изменения вывода.

Директива имеет две формы: @for $var from <начало> through <конец> и @for $var from <начало> to <конец>. Заметьте различие в словах through и to.

$var может быть любым именем переменной, таким как $i; <начало> и <конец> - выражения SassScript, которые должны возвращать целые числа. Если <начало> больше, чем <конец>, счётчик будет убывать, вместо того, чтобы расти.

Выражение @for устанавливает переменную $var в каждое последующее значение в заданном диапазоне и каждый раз выводит вложенные стили, используя очередное значение переменной $var. Форма from ... through, диапазон включает значения <начало> и <конец>, а форма from ... to не включает значение <конец>. При использовании синтаксиса through,

@for $i from 1 through 3 {
  .item-#{$i} { width: 2em * $i; }
}

компилируется в

.item-1 {
  width: 2em; }
.item-2 {
  width: 4em; }
.item-3 {
  width: 6em; }

На сайте функционирует система проверки ошибок. Обнаружив неточность в тексте, выделите ее и нажмите Ctrl + Enter. Также отправить оповещение об ошибке можно, нажав на эту ссылку.