Sass loops

Loop scss

@for $i from 1 through 6 {
    .grid-#{$i} {
        width: 100px*$i;
    }
}

@for $i from 1 through 3 {
  ul:nth-child(3n + #{$i}) {
    background-color: lighten($base-color, $i * 5%);
  }
}

$base-color: #036;@for $i from 1 through 3 {
  ul:nth-child(3n + #{$i}) {
    background-color: lighten($base-color, $i * 5%);
  }
}

@for $i from 1 through 3 {
  ul:nth-child(3n + #{$i}) {
   color: blue;
  }
}

@each $theme-name, $theme-color in $colors-theme-bo {
  .theme-#{$theme-name} {
    color: $theme-color;
  }
}

Similar codes

3 votes262 views1 answer
Increase text from input
CSS
0 vote212 views1 answer
Autocomplete widget set z-index
CSS
25 votes222 views4 answers
Set visibility css
CSS
60 votes216 views3 answers
Adding shadow to a div
CSS
0 vote272 views1 answer
@keyframes opact
CSS
17 votes221 views4 answers
Css center element on screen
CSS
15 votes222 views2 answers
Border-box css
CSS
4 votes197 views4 answers
What is the "style", when creating an internal CSS?
CSS
12 votes216 views4 answers
Sticky header
CSS
1 vote206 views1 answer
Setting paragraph margin to 0
CSS