2017-07-18 2 views
0

Avec l'aide de la boucle de @for dans SASS je veux appliquer le remplissage (unité de pixel) à ma liste en multipliant pour chaque niveau mais lui donnant moi la production brute . Mon code SASS est:J'essaye de multiplier le remplissage avec la boucle for dans sass mais cela n'arrive pas

@for $i from 1 through 5 { 
.chapter-summary { 
    &:nth-child(#{$i}) { 
     padding-bottom: (10px) * #{$i}; 
    } 
} 

}

et sa me donner la sortie suivante:

.chapter-summary:nth-child(1) { 
    padding-bottom: 10px * 1; 
} 

.chapter-summary:nth-child(2) { 
    padding-bottom: 10px * 2; 
} 

.chapter-summary:nth-child(3) { 
    padding-bottom: 10px * 3; 
} 

.chapter-summary:nth-child(4) { 
    padding-bottom: 10px * 4; 
} 

.chapter-summary:nth-child(5) { 
    padding-bottom: 10px * 5; 
} 

Besoin d'une solution

Répondre

1

Ok guyz Je suis la solution et qui est comme suit:

@for $i from 1 through 5 { 
    .chapter-summary { 
     &:nth-child(#{$i}) { 
      padding-bottom: #{$i * 10px}; 
     } 
    } 
}