sass Loops and Conditons While loop
Example
The @while directive will loop over a block of code until the condition specified becomes false. In the following example, this loop will run until $font-size <= 18 while incrementing the value for $font-size by 2.
$font-size: 12; @while $font-size <= 18 { .font-size-#{$font-size} { font-size: ($font-size * 1px); } $font-size: $font-size + 2; } Output of above code
.font-size-12 { font-size: 12px; } .font-size-14 { font-size: 14px; } .font-size-16 { font-size: 16px; } .font-size-18 { font-size: 18px; } 
