For loop question on the $i


#1

I got through the lesson but I don’t understand how it worked. The $i is never explicitly defined so how was it * by $step? and what does it mean in the ray nth-child string interpolation #{}? Was it implicitly defined at some point?
Thanks for any help.

$total: 10; //Number of .ray divs in our html
$step: 360deg / $total; //Used to compute the hue based on color-wheel


.ray {
  height: 30px;
}

//Add your for-loop here:
@for $i from 1 through $total {
  .ray:nth-child(#{$i}) {
    background: adjust-hue(blue, $i * $step);
   }
}


#2

It is defined, by @for. The variable immediately following the keyword becomes the iterator variable.


#3

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.