рдЪреБрдиреМрддреА рднрдВрдбрд╛рд░рдг-рдбреЗрдЯрд╛-рдХреЗ рд╕рд╛рде-рд╕рд╕-рдЪрд░ рдХрд╛ рдПрдХ рдореБрджреНрджрд╛ рд╣реИред
рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рдПрдЬреЗрдВрдЯ рд╣реИ: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.87 Safari/537.36
ред
<style>
$text-color: red;
.header{
text-align: center;
}
.blog-post h2 {
color: $text-color;
}
</style>
<h1 class="header">Learn Sass</h1>
<div class="blog-post">
<h2>Some random title</h2>
<p>This is a paragraph with some random text in it</p>
</div>
<div class="blog-post">
<h2>Header #2</h2>
<p>Here is some more random text.</p>
</div>
<div class="blog-post">
<h2>Here is another header</h2>
<p>Even more random text within a paragraph</p>
</div>
рд╕рднреА рдХреЛ рдирдорд╕реНрдХрд╛рд░, рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдореБрдЭреЗ рдЪреБрдиреМрддреА рдХреЗ рд╕рд╛рде рдбреЗрдЯрд╛ рд╡рд╛рдпрд░рд┐рдВрдЧ рдореЗрдВ рдПрдХ рдмрдЧ рдорд┐рд▓ рдЧрдпрд╛ред рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдореИрдВрдиреЗ рд╕рдм рдХреБрдЫ рдареАрдХ рдХрд┐рдпрд╛, рд▓реЗрдХрд┐рди h2 рдФрд░ .blog-post рддрддреНрд╡реЛрдВ рдХрд╛ рд░рдВрдЧ рд▓рд╛рд▓ рдореЗрдВ рдирд╣реАрдВ рдмрджрд▓рддрд╛ред рдореИрдВ рджреЛ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рдХрд╣рд╛рдирд┐рдпреЛрдВ рдХреЛ рдкрд╛рд░рд┐рдд рдХрд░рддрд╛ рд╣реВрдВ рд▓реЗрдХрд┐рди рдпреЗ рдирд╣реАрдВ:
рдЖрдкрдХреЗ .blog- рдкреЛрд╕реНрдЯ рддрддреНрд╡ рдХрд╛ рд░рдВрдЧ рд▓рд╛рд▓ рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдПред
рдЖрдкрдХреЗ h2 рддрддреНрд╡реЛрдВ рдореЗрдВ рд▓рд╛рд▓ рд░рдВрдЧ рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдПред
рдпрд╣ рднреА рд▓рд╛рд▓ рдирд╣реАрдВ рдмрджрд▓рддрд╛ рд╣реИред рд▓реЗрдХрд┐рди рдпрд╣ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рдХрд╣рд╛рдирд┐рдпреЛрдВ рдХреЛ рдкрд╛рд░рд┐рдд рдХрд░рддрд╛ рд╣реИ:
рдЖрдкрдХреЗ рдХреЛрдб рдореЗрдВ рд▓рд╛рд▓ рд░рдВрдЧ рдХреЗ рдореВрд▓реНрдп рдХреЗ рд╕рд╛рде $ рдЯреЗрдХреНрд╕реНрдЯ-рд░рдВрдЧ рдХреЗ рд▓рд┐рдП рдШреЛрд╖рд┐рдд рдПрдХ рд╕реИрд╕ рдЪрд░ рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдПред
рдЖрдкрдХреЗ рдХреЛрдб рдХреЛ .blog-post рдФрд░ h2 рдЖрдЗрдЯрдо рдХреЗ рд▓рд┐рдП рд░рдВрдЧ рдмрджрд▓рдиреЗ рдХреЗ рд▓рд┐рдП $ рдЯреЗрдХреНрд╕реНрдЯ-рд░рдВрдЧ рдЪрд░ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдЪрд╛рд╣рд┐рдП
рдЕрдЧреНрд░рд┐рдо рдзрдиреНрдпрд╡рд╛рдж, рдФрд░ рдмреАрдЯрд╛ рдореЗрдВ рдирдИ рдЪреАрдЬреЗрдВ рдЕрджреНрднреБрдд рд▓рдЧрддреА рд╣реИрдВ рдорд╣рд╛рди рдХрд╛рдо рдХрд░рддреЗ рд░рд╣реЛ! рдЙрдирдореЗрдВ рд╕реЗ рдЕрдзрд┐рдХ рдХреЗ рдорд╛рдзреНрдпрдо рд╕реЗ рдХрд╛рдо рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдЗрдВрддрдЬрд╛рд░ рдирд╣реАрдВ рдХрд░ рд╕рдХрддрд╛! ЁЯСН
@ Azbo400 рдЗрд╕ рдореБрджреНрджреЗ рдХреА рд░рд┐рдкреЛрд░реНрдЯрд┐рдВрдЧ рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рджред рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рд╣рдо рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдЕрднреА рддрдХ рд╕реИрд╕ рдХреЛ рд╕рдВрдХрд▓рд┐рдд рдХрд░рдиреЗ рдХрд╛ рд╕рдорд░реНрдерди рдирд╣реАрдВ рдХрд░рддреЗ рд╣реИрдВ actually
@ рд╕рд┐рд╕реНрдЯрд┐рдореЛрдЯрд┐рдХ рдУрд╣ рд╣рд╛рд╣рд╛, рдЬреЛ рд╕рдордЭ рдореЗрдВ рдЖрддрд╛ рд╣реИ! рдзрдиреНрдпрд╡рд╛рдж ЁЯШД
рдореБрдЭреЗ рдорд╛рдл рдХрд░реЗрдВ! рд╣рдореЗрдВ рд▓реЛрдЧреЛрдВ рдХреЛ рдПрдХ рд╣реЗрдб рдЕрдк рджреЗрдирд╛ рдЪрд╛рд╣рд┐рдП рдерд╛ рдХрд┐ рдпрд╣ рдЕрдиреБрднрд╛рдЧ рдареАрдХ рд╕реЗ рдХрд╛рдо рдирд╣реАрдВ рдХрд░реЗрдЧрд╛ред рдЗрд╕ рдореБрджреНрджреЗ рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рдж, @ Azbo400
@ рд╣рдХреБрдЬ рдпрд╣ рдареАрдХ рд╣реИ, рдХреЛрдИ рдмрд╛рдд рдирд╣реАрдВред ЁЯШГ
рд╣рд╛рдБред рдпрд╣ рдХрд╛рдо рдирд╣реАрдВ рдХрд░ рд░рд╣рд╛ рд╣реИред рдХреНрдпрд╛ рддрдп рд╣реЛрдиреЗ рдкрд░ рдХреЛрдИ рдЕрдзрд┐рд╕реВрдЪрдирд╛ рд╣реЛрдЧреА?
рд╣рдо рдЕрднреА рддрдХ "рд╕рд╛рд╕" рдХрд╛ рд╕рдорд░реНрдерди рдирд╣реАрдВ рдХрд░рддреЗ рд╣реИрдВ! Lmao !!!
22 рдЬрдирд╡рд░реА, 2017 12:19 рдкреВрд░реНрд╡рд╛рд╣реНрди, "рдкреНрд░рдореЛрдж рдкреЛрддреНрджрд╛рд░" рд╕реВрдЪрдирд╛рдПрдВ @github.com рдиреЗ рд▓рд┐рдЦрд╛:
рд╣рд╛рдБред рдпрд╣ рдХрд╛рдо рдирд╣реАрдВ рдХрд░ рд░рд╣рд╛ рд╣реИред рдХреНрдпрд╛ рддрдп рд╣реЛрдиреЗ рдкрд░ рдХреЛрдИ рдЕрдзрд┐рд╕реВрдЪрдирд╛ рд╣реЛрдЧреА?
-
рдЖрдк рдЗрд╕реЗ рдкреНрд░рд╛рдкреНрдд рдХрд░ рд░рд╣реЗ рд╣реИрдВ рдХреНрдпреЛрдВрдХрд┐ рдЖрдкрдХреЛ рдЗрд╕ рдзрд╛рдЧреЗ рдХреА рд╕рджрд╕реНрдпрддрд╛ рджреА рдЧрдИ рд╣реИред
рдЗрд╕ рдИрдореЗрд▓ рдХрд╛ рдЙрддреНрддрд░ рд╕реАрдзреЗ рджреЗрдВ, рдЗрд╕реЗ GitHub рдкрд░ рджреЗрдЦреЗрдВ
https://github.com/freeCodeCamp/freeCodeCamp/issues/12699#issuecomment-274311826 ,
рдпрд╛ рдзрд╛рдЧрд╛ рдореНрдпреВрдЯ рдХрд░реЗрдВ
https://github.com/notifications/unsubscribe-auth/AVHZeUIbLrZVFpBbIy0z9uTcDlOwHHoDks5rUvULgaJpZM4LqJWk
ред
рд╡реЗ рдЖрдкрд╕реЗ рдХреЛрдИ рд╕рд╛рд╕ рдирд╣реАрдВ рдЪрд╛рд╣рддреЗ рд╣реИрдВред рдордЬрд╛рдХ
рдореИрдВ рдорд╛рдирддрд╛ рд╣реВрдВ рдХрд┐ рдпрд╣ рд▓реЛрдЧреЛрдВ рдХреЛ рдЪреЗрддрд╛рд╡рдиреА рджреЗрдиреЗ рдХреЗ рд▓рд┐рдП рдПрдХ рдЕрдЪреНрдЫрд╛ рд╡рд┐рдЪрд╛рд░ рд╣реЛрдЧрд╛ рдХрд┐ рд╕реИрд╕ рдЕрднреА рддрдХ рдХрд╛рдо рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реИред
рдЗрд╕ рдмреАрдЪ, рдореИрдВ рд▓реЛрдЧреЛрдВ рдХреЛ рдЕрдкрдиреЗ рд╕реНрд╡рдпрдВ рдХреЗ рдорд╢реАрдиреЛрдВ рдкрд░ рд╕реИрд╕ рдХрдВрдкрд╛рдЗрд▓рд░ рд╕реНрдерд╛рдкрд┐рдд рдХрд░рдиреЗ рдФрд░ рдЙрдирдХреЗ рдЧрд╛рдЗрдб (рдФрд░ / рдпрд╛ FCC рдХреЗ рд╕реИрд╕ рдЯреНрдпреВрдЯреЛрд░рд┐рдпрд▓реНрд╕) рдХрд╛ рдЕрдиреБрд╕рд░рдг рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рд╕реИрд╕ рдЖрдзрд┐рдХрд╛рд░рд┐рдХ рдкреЗрдЬ рдХреЗ рдЧрд╛рдЗрдб рдХрд╛ рдкрд╛рд▓рди рдХрд░рдиреЗ рдХреА рд╕рд▓рд╛рд╣ рджреЗрддрд╛ рд╣реВрдВред рдЧрд╛рдЗрдб рдпрд╣рд╛рдВ рд╕реЗ рд╢реБрд░реВ рд╣реЛрддрд╛ рд╣реИ: http://sass-lang.com/install
рдЪреИрд▓реЗрдВрдЬ рд╕реНрдЯреЛрд░рд┐рдВрдЧ-рдбреЗрдЯрд╛-рд╡рд┐рде-рд╕рд╕-рд╡реЗрд░рд┐рдПрдмрд▓реНрд╕ рдХреЛ рдЕрдкрдиреЗ рдЕрдВрддрд┐рдо рджреЛ рдкрд░реАрдХреНрд╖рдгреЛрдВ рдХреЛ рд░рд┐рдлрд▓реЗрдХреНрдЯ рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ рддрд╛рдХрд┐ рдпрд╣ рдирд┐рд░реНрдзрд╛рд░рд┐рдд рдЪрд░ рдХреЗ рдЙрдкрдпреЛрдЧ рдХреЗ рд▓рд┐рдП рдЬрд╛рдБрдЪ рдХрд░ рд╕рдХреЗред
@ рд╣реИрдорджрдмрджреЛрд▓рд╕рд╛рд╣реЗрдм рдмрд╣реБрдд рдмрдврд╝рд┐рдпрд╛ - рдЕрдЪреНрдЫреА рдХреЙрд▓ред рдХреНрдпрд╛ рдЖрдкрдХреЗ рдкрд╛рд╕ рдХреЛрдИ рд╡рд┐рдЪрд╛рд░ рд╣реИ рдХрд┐ рдХреИрд╕реЗ рдЙрдиреНрд╣реЗрдВ рдлрд┐рд░ рд╕реЗ рддреИрдпрд╛рд░ рдХрд░рдиреЗ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдЬрд╛рдирд╛ рдЬрд╛рдП?
@QuincyLarson рдореИрдВ рдЗрд╕ рдкрд░ рд╣реВрдБ
рдпрджрд┐ рдХреЛрдИ рдЗрд╕ рд╕рдорд╕реНрдпрд╛ рд╕реЗ рдирд┐рдкрдЯрдирд╛ рдЪрд╛рд╣рддрд╛ рд╣реИ рддреЛ рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рдХрд╛рдо рдЖ рд╕рдХрддрд╛ рд╣реИред
рдкрд░реАрдХреНрд╖рдг рдХрд┐рдП рдЬрд╛рдиреЗ рд╡рд╛рд▓реЗ рдкрд░реАрдХреНрд╖рдгреЛрдВ рдХрд╛ рд╕реНрдерд╛рди:
https://github.com/freeCodeCamp/freeCodeCamp/blob/6d7092928e852755fa0d4d9489b3c8748b466a94/seed/challenges/03-front-end-libraries/sass.json#L25
рдЪрд╛рд░ рдкрд░реАрдХреНрд╖рдг рд╣реИрдВ рдЬрд┐рдиреНрд╣реЗрдВ рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рджреЛ рд╕реЗ рдмрджрд▓рд╛ рдЬрд╛рдирд╛ рдЪрд╛рд╣рд┐рдПред
"tests": [
{
"text": "Your code should have a Sass variable declared for <code>$text-color</code> with a value of red.",
"testString": "assert(code.match(/\\$text-color\\s*?:\\s*?red\\s*?;/g), 'Your code should have a Sass variable declared for <code>$text-color</code> with a value of red.');"
},
{
"text": "Your code should use the <code>$text-color</code> variable to change the <code>color</code> for the <code>.blog-post</code> and <code>h2</code> items.",
"testString": "assert(code.match(/\\.blog-post\\s*?\,\\s*?h2\\s*?{\\s*?color:\\s*?\\$text-color\\s*?;/g), 'Your code should use the <code>$text-color</code> variable to change the <code>color</code> for the <code>.blog-post</code> and <code>h2</code> items.');"
}
]
рдкреАрдЖрд░ рдмрдирд╛рдиреЗ рд╕реЗ рдкрд╣рд▓реЗ рд╕рдорд╛рдзрд╛рди рдХрд╛ рдкрд░реАрдХреНрд╖рдг рдХрд░реЗрдВ
@ahmadabdolsaheb
рдкреАрдЖрд░ рдмрдирд╛рдиреЗ рд╕реЗ рдкрд╣рд▓реЗ рд╕рдорд╛рдзрд╛рди рдХрд╛ рдкрд░реАрдХреНрд╖рдг рдХрд░реЗрдВ
рдореБрдЭреЗ рдЗрд╕рдХреЗ рдкрд░реАрдХреНрд╖рдг рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдХреИрд╕реЗ рдЬрд╛рдирд╛ рдЪрд╛рд╣рд┐рдП? рдЕрдЧрд░ рдореИрдВ freecodecamp
рд░реЗрдкреЛ рдореЗрдВ рд░рд╣рдиреЗ рд╡рд╛рд▓реА рдмреАрдЬ рдлрд╝рд╛рдЗрд▓реЛрдВ рдореЗрдВ рдкрд░рд┐рд╡рд░реНрддрди рдХрд░рддрд╛ рд╣реВрдВ рддреЛ рдпрд╣ learn
рд░реЗрдкреЛ рдореЗрдВ рдкреНрд░рддрд┐рдмрд┐рдВрдмрд┐рдд рдирд╣реАрдВ рд╣реЛрдЧрд╛ рдХреНрдпреЛрдВрдХрд┐ рдпрд╣ рдЪреБрдиреМрддрд┐рдпреЛрдВ рдХреЛ рдкреНрд░рд╛рдкреНрдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП @freecodecamp/curriculum
рдиреЛрдб рдореЙрдбреНрдпреВрд▓ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддрд╛ рд╣реИред
рдпрд╣рд╛рдВ рддрдХ тАЛтАЛрдХрд┐ рдЕрдЧрд░ рдореИрдВ рд╕реНрдерд╛рдиреАрдп рд░реВрдк рд╕реЗ curriculum
рд░реЗрдкреЛ рдореЗрдВ рдмрджрд▓рд╛рд╡ рдХрд░рддрд╛ рд╣реВрдВ, рддреЛ рдпрд╣ learn
рд░реЗрдкреЛ рдореЗрдВ рдкреНрд░рддрд┐рдмрд┐рдВрдмрд┐рдд рдирд╣реАрдВ рд╣реЛрдЧрд╛ред
рдореИрдВ рдЕрдм рд╕рд╛рд╕ рдкрд╛рда рд╕реЗ рдЧреБрдЬрд░ рд░рд╣рд╛ рд╣реВрдВред
рдореИрдВ рдХреЛрдИ рднреА рдЕрддрд┐рд░рд┐рдХреНрдд рдкрд╛рда рдкреЛрд╕реНрдЯ рдХрд░реВрдВрдЧрд╛ рдЬреЛ рдЯреВрдЯ рдЧрдпрд╛ рд╣реИред
рдЯреВрдЯреЗ рдкрд░реАрдХреНрд╖рдгреЛрдВ рдХреЗ рд╕рд╛рде рд╕рд╛рд╕ рдкрд╛рда рдХреА рдкреВрд░реА рд╕реВрдЪреА:
https://learn.freecodecamp.org/front-end-libraries/sass/store-data-with-sass-variables
https://learn.freecodecamp.org/front-end-libraries/sass/use-for-to-create-a-sass-loop
https://learn.freecodecamp.org/front-end-libraries/sass/use-each-to-map-over-items-in-a-list
https://learn.freecodecamp.org/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with-while
рдпрд╣рд╛рдБ рдПрдХ рджреГрд╢реНрдп рд╕рд╣рд╛рдпрддрд╛ рд╣реИ:
рдореИрдВрдиреЗ рднреА рдЖрдВрддрд░рд╛рдпрд┐рдХ рдкрд░реАрдХреНрд╖рдг рдкрд╛рд╕рд┐рдВрдЧ ("рдкрд░реАрдХреНрд╖рдг рдЪрд▓рд╛рдПрдВ" рд╕реНрдкреИрдорд┐рдВрдЧ рджреНрд╡рд╛рд░рд╛) рдХреА рдкреБрд╖реНрдЯрд┐ рдХреА рд╣реИ:
https://learn.freecodecamp.org/front-end-libraries/sass/store-data-with-sass-variables
https://learn.freecodecamp.org/front-end-libraries/sass/use-each-to-map-over-items-in-a-list
рд▓реЗрдХрд┐рди рдЕрдиреНрдп 2 рдЯреВрдЯреЗ рд╣реБрдП рд╕рд╛рд╕ рдкрд╛рдареЛрдВ рдкрд░ рдирд╣реАрдВ (рдпреЗ рд╣рдореЗрд╢рд╛ рдкрд╛рд╕ рд╣реЛрдиреЗ рдореЗрдВ рд╡рд┐рдлрд▓ рд╣реЛрддреЗ рд╣реИрдВ):
https://learn.freecodecamp.org/front-end-libraries/sass/use-for-to-create-a-sass-loop
https://learn.freecodecamp.org/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with-while
рдореИрдВ рд╢реБрд░реВ рдореЗрдВ рдПрдХ рд╣реА рдореБрджреНрджреЛрдВ рд╕реЗ рдЬреВрдЭрддрд╛ рд░рд╣рд╛ рд▓реЗрдХрд┐рди рдЕрдм рддрдХ рдореИрдВ рд╕рднреА рдХреЛ рдкрд╛рд╕ рдХрд░ рдЪреБрдХрд╛ рд╣реВрдВ (
рдХреБрдЫ рдЙрджрд╛рд╣рд░рдгреЛрдВ рдХреЗ рд▓рд┐рдП SASS рдмрд┐рдЯ рдХреЗ рдХрд┐рд╕реА рднреА @ рдФрд░ рднреА рдЙрджрд╛рд╣рд░рдг рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ
рдХреЛрдб рдХреЗ рдмреАрдЪ рдХрд┐рд╕реА рднреА рдЦрд╛рд▓реА рд▓рд╛рдЗрдиреЛрдВ рдХреЛ рд╣рдЯрд╛рдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдХрд░реЗрдВ рдФрд░ - рдЕрдЧрд░ рд╡рд╣ рдЗрд╕реЗ рд╣рд▓ рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реИ - рдПрд╕рдПрдПрдирдПрд╕ рдХреЛрдб рдХреЛ рдмрд┐рд▓реНрдХреБрд▓ рднреА рдЗрдВрдбреЗрдВрдЯ рдирд╣реАрдВ рдХрд░ рд░рд╣рд╛ рд╣реИред
[рд╕рдлрд╛рд░реА 11.0.2 рдХреЗ рд╕рд╛рде рдПрдлрд╕реАрд╕реА рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛]
@MikeForde рдпрд╣ рдореЗрд░реЗ рд▓рд┐рдП рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ рдЬрдм рд╕рдлрд╛рд░реА рдкрд░ рд╕реНрд╡рд┐рдЪ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдпрд╣ рдПрдХ рдореЙрдбреНрдпреВрд▓ рдкрд╛рд░рд┐рдд рдХрд┐рдпрд╛ рдЧрдпрд╛ред рд╣рд╛рд▓рд╛рдБрдХрд┐, рдореИрдВ рдЕрднреА рднреА рдЗрд╕реЗ рдХреНрд░реЛрдо 67 рдореЗрдВ рдЪрд▓рд╛рдиреЗ рдХреЗ рджреМрд░рд╛рди рдХрд┐рд╕реА рднреА рддрд░рд╣ рд╕реЗ рдХрд╛рдо рдирд╣реАрдВ рдХрд░ рдкрд╛рдпрд╛ред
рдореИрдВ рдЙрдиреНрд╣реЗрдВ рд╕рдлрд╛рд░реА рдпрд╛ рдХреНрд░реЛрдо 67 рдореЗрдВ рдХрд╛рдо рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдирд╣реАрдВ рдорд┐рд▓рд╛
рд╕рднреА рдЗрдВрдбреЗрдВрдЯреЗрд╢рди рдХреЛ рд╣рдЯрд╛рдиреЗ рдФрд░ рдХреЗ рднреАрддрд░ рд░рд┐рдХреНрддрд┐
рдХреЛрдИ рд╕рд╣рдорддрд┐ рдирд╣реАрдВ рд╣реИ, рдЗрд╕рдореЗрдВ рд╕рдлреЗрдж рд╕реНрдерд╛рди рдХреА рддреБрд▓рдирд╛ рдореЗрдВ рдЕрдзрд┐рдХ рд╣реИред рдореИрдВрдиреЗ рдЬреЛ рджреЗрдЦрд╛ рд╡рд╣ рдпрд╣ рд╣реИ рдХрд┐ - @ рдЙрджрд╛рд╣рд░рдг рдХреЗ рд╕рд╛рде - рдпрджрд┐ рдореИрдВ "рд░рди рдж рдЯреЗрд╕реНрдЯ" рдмрдЯрди
рд╣рд╛рдп рд╕рдм, рдЬреЛ рднреА рдореБрджреНрджреЗ рд╣реИрдВ, рд╡реЗ рдареАрдХ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рджрд┐рдЦрд╛рдИ рджреЗрддреЗ рд╣реИрдВред Chrome рд╕рдВрд╕реНрдХрд░рдг 67.0.3396.87 (рдЖрдзрд┐рдХрд╛рд░рд┐рдХ рдмрд┐рд▓реНрдб) (64-рдмрд┐рдЯ) рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╣реБрдП рдкрд╣рд▓реА рдмрд╛рд░ рдЪреБрдиреМрддреА рджреА рдЧрдИ
рдирд╣реАрдВ, рдЕрднреА рднреА рдореЗрд░реЗ рд╕рд╛рде рд╣реЛ рд░рд╣рд╛ рд╣реИ рдЬрдм рдореИрдВ рдкрд░реАрдХреНрд╖рдгреЛрдВ рдХреА рдХреЛрд╢рд┐рд╢ рдХрд░рддрд╛ рд╣реВрдВред рдХреЗрд╡рд▓ рдХреБрдЫ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛рдУрдВ рдХреЛ рдкреНрд░рднрд╛рд╡рд┐рдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рд▓рдЧрддрд╛ рд╣реИред
рдПрдХ рд╣реА рдореБрджреНрджреЗ рдореЗрдВ рднрд╛рдЧ рдЧрдпрд╛ - рдлрд╝рд╛рдпрд░рдлрд╝реЙрдХреНрд╕ 56.0.2ред
рд╕рднреА рд╡реНрд╣рд╛рдЯреНрд╕рдПрдк рдХреЛ рдордВрдЬреВрд░реА рджреЗ рджреА; рдЗрдВрдбреЗрдВрдЯрд┐рдВрдЧ рдЖрджрд┐ рдХреА рдЬрд╛рдБрдЪ рдХреАред
рдкрд┐рдЫрд▓реЗ рджреЛ рдкрд░реАрдХреНрд╖рдг рдЕрднреА рднреА рд╡рд┐рдлрд▓ рд░рд╣реЗред рд░рди рдЯреЗрд╕реНрдЯ рдмрдЯрди рдХреЛ "рд╕реНрдкреИрдо" рдХрд░рдиреЗ рдХрд╛ рдкреНрд░рдпрд╛рд╕ рдХрд┐рдпрд╛ рдЬрд╛ рд░рд╣рд╛ рд╣реИред
=====
рд╕рдВрдкрд╛рджрд┐рдд рдХрд░реЗрдВ: рдореИрдВ рдЕрдВрдд рдореЗрдВ рдЗрд╕реЗ рдХрд╛рдо рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдорд┐рд▓рд╛ред рдпрд╛рдж рдирд╣реАрдВ рд╣реИ рдХрд┐ рдХреНрдпрд╛ рдпрд╣ рдореЗрд░реА рдУрд░ рд╕реЗ рдХреБрдЫ рдЫреЛрдЯреА рд╕реА рддреНрд░реБрдЯрд┐ рдХреЗ рдХрд╛рд░рдг рдерд╛ рдпрд╛ рдХреЗрд╡рд▓ рдзреИрд░реНрдпрдкреВрд░реНрд╡рдХ "рд░рди рдЯреЗрд╕реНрдЯ" рдмрдЯрди рдХреЛ рдмрд╛рд░-рдмрд╛рд░ рдорд╛рд░рдирд╛ред рдореИрдВ рдЗрд╕ рдПрдХ рдХреЗ рдмрд╛рдж рдХрдИ рдПрд╕рдПрдПрд╕ рдкрд╛рдареЛрдВ рдкрд░ "рд░рди рдЯреЗрд╕реНрдЯ рдмрдЯрди рдореИрд╢" рд╡рд┐рдзрд┐ рдХрд░ рд░рд╣рд╛ рд╣реВрдВред
рдпрд╣рд╛рдБ Sass рдХреЗ рд▓рд┐рдП рдЯреНрд░рд┐рдХ: Sass рд▓реВрдк рдмрдирд╛рдиреЗ рдХреЗ рд▓рд┐рдП @for рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВ:
рд╡рд╣рд╛рдБ рдХреЛрдИ рджреВрд╕рд░рд╛ рдореМрдХрд╛ рдирд╣реАрдВ рд╣реИ рдХреНрдпреЛрдВрдХрд┐ рдпрдХреАрди рдХреЗ рд▓рд┐рдП рдЗрд╕ рдЪреБрдиреМрддреА рдореЗрдВ рдмрдЧ рд╣реИ ..
@for $j from 1 through 5 {
.text-#{$j} { font-size: 10px* $j; }
}
Hello
Hello
Hello
Hello
Hello
рдЖрдк div рдЯреИрдЧ рдореЗрдВ рдЕрдкрдиреА рд░рдВрдЧ рд╢реИрд▓реА рдЬреЛрдбрд╝ рд╕рдХрддреЗ рд╣реИрдВред рдпрд╣ рдореЗрд░реЗ рд▓рд┐рдП рдХрд╛рдо рдХрд░рддрд╛ рд╣реИред
<div class="blog-post" style="color: red;">
@ mahmoud-coo6 рдХреНрдпрд╛ рдЖрдкрдХреА рд╡рд┐рдзрд┐ рдХрд┐рд╕реА рд╢реИрд▓реА рдкрд░ рдЬрдм рддрдХ рдХрд┐ рдХреЛрдИ рд╕реНрдерд┐рддрд┐ @ рдХреЗ рд╕рд╛рде рдирд╣реАрдВ рд╣реИ ?
рдореЗрд░реЗ рдпрд╣рд╛рдБ рдПрдХ рдЪреЗрддрд╛рд╡рдиреА рд╣реИ: Your .text-1 class should have a font-size of 5px.
рдореБрдЭреЗ рдкреВрд░рд╛ рдпрдХреАрди рд╣реИ рдХрд┐ рдлрд╝реЙрдиреНрдЯ-рдЖрдХрд╛рд░ 5px рд╣реИред
рдореИрдВ рдареАрдХ рдХрд░рддрд╛ рд╣реВрдВ рдПрдХ рд╢реИрд▓реА рд▓рд╛рдЧреВ рдХрд░реЗрдВ рдЬрдм рддрдХ рдХрд┐ рдПрдХ рд╕реНрдерд┐рддрд┐ @ рд▓реА рдХреЗ рд╕рд╛рде рдирд╣реАрдВ рд╣реИ? Google-рдХреНрд░реЛрдо рдХреЗ рдмрдЬрд╛рдп рдлрд╝рд╛рдпрд░рдлрд╝реЙрдХреНрд╕ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдЪреБрдиреМрддреА рдореЗрд░реЗ рд▓рд┐рдП рдХрд╛рдо рдХреА рд╣реИред
рдореИрдВ div рдЯреИрдЧ рдХреЗ рд▓рд┐рдП рдкреГрд╖реНрдарднреВрдорд┐ рд╢реИрд▓реА рдЬреЛрдбрд╝ рджрд┐рдпрд╛ рдерд╛ ..... рдЗрди рдЦрд░рд╛рдм sass рдЪреБрдиреМрддрд┐рдпреЛрдВ рдХреЛ рдкрд╛рдиреЗ рдХреЗ рд▓рд┐рдП рдЕрдкрдиреЗ рдкрд░реАрдХреНрд╖рдг рдкрд╛рд░рд┐рдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП .... !!
<div class="blue-bg" style="background-color: blue"></div>
<div class="black-bg" style="background-color: black"></div>
<div class="red-bg" style="background-color: red"></div>
рдпрд╣рд╛рдБ рд╕рдорд╛рдзрд╛рди @flyfishingbarbara : рд╡рд╣рд╛рдБ рдХреБрдЫ рд╕рдордп рдХрд╛рдо рдирд╣реАрдВ рдХрд┐рдпрд╛ рдХреНрдпреЛрдВрдХрд┐ рд╡рд╣рд╛рдБ рд╡реЗрдмрд╕рд╛рдЗрдЯ рдореЗрдВ рдмрдЧ рд╣реИ
@each $color in blue,black, red {
.#{$color}-bg { background-color: $color;}
}
div {
height: 200px;
width: 200px;
}
рдореБрджреНрджрд╛ @for
рдФрд░ @each
рд╕рд╛рде рд╡рд╛рдкрд╕ рдЖ рдЧрдпрд╛ рд╣реИред
рдпрд╣ рдХреНрд░реЛрдо 68.0.3440.106 рдкрд░ рдХрд╛рдо рдирд╣реАрдВ рдХрд░реЗрдЧрд╛ рдФрд░ рдУрдкреЗрд░рд╛ 55.0 рдкрд░ рдирд╣реАрдВ, рд▓реЗрдХрд┐рди рдпрд╣ рдлрд╝рд╛рдпрд░рдлрд╝реЙрдХреНрд╕ 59.0.2 (рд╕рднреА 64-рдмрд┐рдЯ) рдкрд░ рддреНрд░реБрдЯрд┐рдкреВрд░реНрдг рд░реВрдк рд╕реЗ рдХрд╛рдо рдХрд░рддрд╛ рд╣реИред рдкрд┐рдЫрд▓реЗ рддреАрди рдЕрднреНрдпрд╛рд╕реЛрдВ рдХреЛ рд╣рд╛рд▓рд╛рдВрдХрд┐ "рд░рди рдж рдЯреЗрд╕реНрдЯ" рдмрдЯрди рдХреА рдЬрд╝рд░реВрд░рдд рдереА
@raisedadead @ValeraS
рдХреНрдпрд╛ рдпрд╣ рдЗрд╕ рдореБрджреНрджреЗ рдХреЛ рдмрдВрдж рдХрд░рддрд╛ рд╣реИ?
https://github.com/freeCodeCamp/freeCodeCamp/pull/27716
@paulywill рдпрд╣ рдЗрд╕ рд╕рдорд╕реНрдпрд╛ рд╕реЗ рд╕рдВрдмрдВрдзрд┐рдд рдирд╣реАрдВ рд╣реИ, рдФрд░ рдпрд╣ рд╕рдорд╕реНрдпрд╛ рдкрд╣рд▓реЗ рд╣реА рдорд╛рд╕реНрдЯрд░ рд╢рд╛рдЦрд╛ рдореЗрдВ рд╣рд▓ рд╣реЛ рдЪреБрдХреА рд╣реИред
рдпреЛрдЧреНрдп, рдореИрдВ рдПрдХ рд╣реА рд╕рдорд╕реНрдпрд╛ рд╕реЗ рдореБрд▓рд╛рдХрд╛рдд рдХреА ...
@ZTYZZ рдХреНрдпрд╛ рдЖрдк рдмреАрдЯрд╛ рд╕рд╛рдЗрдЯ рдкрд░ рд╕рдорд╛рди рд╕рдорд╕реНрдпрд╛ рдХрд╛ рдЕрдиреБрднрд╡ рдХрд░рддреЗ рд╣реИрдВ?
рдлрд╝рд╛рдпрд░рдлрд╝реЙрдХреНрд╕ рдбреЗрд╡рд▓рдкрд░ рд╕рдВрд╕реНрдХрд░рдг (72.0b2 (64-рдмрд┐рдЯ)) рдкрд░ рдпрд╣ рдХрд╛рдо рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реИред
@nmichalakis рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдХрдВрд╕реЛрд▓ рдореЗрдВ рдЖрдк рдХреНрдпрд╛ рддреНрд░реБрдЯрд┐рдпрд╛рдБ рджреЗрдЦ рд░рд╣реЗ рд╣реИрдВ?
@RandellDawson рдореБрдЭреЗ "рдмрдЧ" рдорд┐рд▓рд╛ рдЕрдЧрд░ рдЪрд░ рдирд╛рдо рдФрд░ ":" рдХреЗ рдмреАрдЪ рдПрдХ рд╕реНрдерд╛рди рд╣реИ, рддреЛ рдпрд╣ рд╕рд╣реА рддрд░реАрдХреЗ рд╕реЗ
рдЗрд╕рд▓рд┐рдП рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП рдЕрдЧрд░ рдореИрдВ рджреМрдбрд╝рддрд╛ рд╣реВрдВ
$ рд╡рд╛рд░-рдирд╛рдо: рд░рдВрдЧ; (":" рд╕реЗ рдкрд╣рд▓реЗ рдФрд░ рдмрд╛рдж рдореЗрдВ рдПрдХ рд╕реНрдерд╛рди) рдпрд╣ рд╕рдВрдХрд▓рд┐рдд рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реИ, рд▓реЗрдХрд┐рди рдЕрдЧрд░ рдореИрдВ рд╕рдорд╛рди рдЪрд▓рд╛рддрд╛ рд╣реВрдВ
$ var-name: рд░рдВрдЧ ($ var рдШреЛрд╖рдгрд╛ рдХреЗ рдмрд╛рдж рдХреЛрдИ рд╕реНрдерд╛рди рд╕рд╣реА рдирд╣реАрдВ рд╣реИ, рдпрд╣ рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ!)
рдХреГрдкрдпрд╛ рдЗрди рд╡рд┐рд╡рд░рдгреЛрдВ рдХреЗ рд╕рд╛рде рдПрдХ рдирдпрд╛ рдореБрджреНрджрд╛ рдЦреЛрд▓реЗрдВред рдзрдиреНрдпрд╡рд╛рджред
@ рдиреАрд▓реЗ, рдХрд╛рд▓реЗ, рд▓рд╛рд▓ рд░рдВрдЧ рдореЗрдВ $ рд░рдВрдЧ
ред # {$ color} -bg {рдкреГрд╖реНрдарднреВрдорд┐-рд░рдВрдЧ: $ рд░рдВрдЧ ;;
}
рд╕рдмрд╕реЗ рдЙрдкрдпреЛрдЧреА рдЯрд┐рдкреНрдкрдгреА
рдЖрдк div рдЯреИрдЧ рдореЗрдВ рдЕрдкрдиреА рд░рдВрдЧ рд╢реИрд▓реА рдЬреЛрдбрд╝ рд╕рдХрддреЗ рд╣реИрдВред рдпрд╣ рдореЗрд░реЗ рд▓рд┐рдП рдХрд╛рдо рдХрд░рддрд╛ рд╣реИред