рдХрд┐рд╕реА рд╕реВрдЪреА рдореЗрдВ рдЖрдЗрдЯрдо рдкрд░ рдореИрдк рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП @each рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВ
https://beta.freecodecamp.org/hi/challenges/sass/use-each-to-map-over-items-in-a-list
рдореЗрд░рд╛ рдХреЛрдб рд╕реНрдкрд╖реНрдЯ рд░реВрдк рд╕реЗ рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ рдФрд░ рдкреВрд░реНрд╡рд╛рд╡рд▓реЛрдХрди рдЕрдиреБрднрд╛рдЧ рдореЗрдВ рд╕рд╣реА рдкрд░рд┐рдгрд╛рдо рдкреНрд░рджрд╛рди рдХрд░рддрд╛ рд╣реИ рд▓реЗрдХрд┐рди рдХрд┐рд╕реА рдХрд╛рд░рдг рд╕реЗ рдореИрдВ рдирд╣реАрдВ рдХрд░рддрд╛
рд╕рдордЭреЗрдВ рдХрд┐ рдореИрдВ рдЪреБрдиреМрддреА рдкрд╛рд╕ рдирд╣реАрдВ рдХрд░рддрд╛ред
<style type='text/sass'>
<strong i="27">@each</strong> $color in blue, black, red {
.#{$color}-bg {background-color: $color}
}
div {
height: 200px;
width: 200px;
}
</style>
<div class="blue-bg"></div>
<div class="black-bg"></div>
<div class="red-bg"></div>
рд╕реНрд░реЛрдд рдореЗрдВ рджреЗрдЦрдиреЗ рдкрд░ рдРрд╕рд╛ рдкреНрд░рддреАрдд рд╣реЛрддрд╛ рд╣реИ рдХрд┐ рдкрд░реАрдХреНрд╖рдг рдореЗрдВ рд╡рд░реНрдЧ рдЪрдпрдирдХрд░реНрддрд╛рдУрдВ рдХреЗ рд▓рд┐рдП рдЖрд╡рд╢реНрдпрдХ .
рд╣реИ
рдиреАрдЪреЗ рдЬрд╝реЛрд░ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реИ рджреЗрдЦреЗрдВ blue-bg
рдФрд░ рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдП .blue-bg
"assert($('blue-bg').css('background-color') == 'rgb(0, 0, 255)', 'message: рдЖрдкрдХреА .blue-bg
рдХрдХреНрд╖рд╛ рдореЗрдВ background-color
рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдП
рдпрд╣ рд▓рд╛рдЗрди рейрезрео-рейреиреж of lines рд╣реИ
рдлреНрд░реАрдХреЛрдбрдХреИрдВрдк/рдмреАрдЬ/рдЪреБрдиреМрддрд┐рдпрд╛рдВ/03-рдлреНрд░рдВрдЯ-рдПрдВрдб-рд▓рд╛рдЗрдмреНрд░реЗрд░реА/рдПрд╕рдПрдПрд╕.
рдХреНрдпрд╛ рдЖрдк рдЬрд╛рдирддреЗ рд╣реИрдВ рдХрд┐ рдХреЛрдИ рдЗрд╕ рдореБрджреНрджреЗ рдХреЛ рдареАрдХ рдХрд░рдиреЗ рдЬрд╛ рд░рд╣рд╛ рд╣реИ?
@ sjames1958gm рд╡рд╣рд╛рдБ рдЕрдЪреНрдЫрд╛ рдХреИрдЪ! рдХреНрдпрд╛ рдЖрдк рдкрд░реАрдХреНрд╖рдгреЛрдВ рдХреЛ рдареАрдХ рдХрд░рдиреЗ рдореЗрдВ рд░реБрдЪрд┐ рд░рдЦрддреЗ рд╣реИрдВ?
рдпрд╣рд╛рдВ рд╡рд╣ рдпреЛрдЧрджрд╛рди рдорд╛рд░реНрдЧрджрд░реНрд╢рд┐рдХрд╛ рд╣реИ рдЬрд┐рд╕рдХрд╛ рдЖрдкрдХреЛ рд╕рдВрджрд░реНрдн рд▓реЗрдирд╛ рдЪрд╛рд╣рд┐рдП рдФрд░ рдпрджрд┐ рдЖрдкрдХреЛ рд╕рд╣рд╛рдпрддрд╛ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ рддреЛ рдпреЛрдЧрджрд╛рдирдХрд░реНрддрд╛ рдЪреИрдЯ рд░реВрдо рд╣реИ ред
рд╕рдмрд╕реЗ рдЙрдкрдпреЛрдЧреА рдЯрд┐рдкреНрдкрдгреА
рд╕реНрд░реЛрдд рдореЗрдВ рджреЗрдЦрдиреЗ рдкрд░ рдРрд╕рд╛ рдкреНрд░рддреАрдд рд╣реЛрддрд╛ рд╣реИ рдХрд┐ рдкрд░реАрдХреНрд╖рдг рдореЗрдВ рд╡рд░реНрдЧ рдЪрдпрдирдХрд░реНрддрд╛рдУрдВ рдХреЗ рд▓рд┐рдП рдЖрд╡рд╢реНрдпрдХ
.
рд╣реИрдиреАрдЪреЗ рдЬрд╝реЛрд░ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реИ рджреЗрдЦреЗрдВ
blue-bg
рдФрд░ рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдП.blue-bg
"assert($('blue-bg').css('background-color') == 'rgb(0, 0, 255)', 'message: рдЖрдкрдХреА
.blue-bg
рдХрдХреНрд╖рд╛ рдореЗрдВbackground-color
рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдПрдпрд╣ рд▓рд╛рдЗрди рейрезрео-рейреиреж of lines рд╣реИ
рдлреНрд░реАрдХреЛрдбрдХреИрдВрдк/рдмреАрдЬ/рдЪреБрдиреМрддрд┐рдпрд╛рдВ/03-рдлреНрд░рдВрдЯ-рдПрдВрдб-рд▓рд╛рдЗрдмреНрд░реЗрд░реА/рдПрд╕рдПрдПрд╕.