๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
728x90

SASS1

Sass/Scss: CSS์˜ ํ˜์‹ ์ ์ธ ํ™•์žฅ Sass/Scss: CSS์˜ ํ˜์‹ ์ ์ธ ํ™•์žฅ 1. ์†Œ๊ฐœ 1.1 Sass/Scss๋ž€? Sass(์‹ค์ œ์ ์ธ ํŒŒ์ผ ํ™•์žฅ์ž๋Š” .scss) ๋ฐ Scss(.scss์™€ .sass ๋‘ ๊ฐ€์ง€ ํ™•์žฅ์ž ๋ชจ๋‘ ์‚ฌ์šฉ ๊ฐ€๋Šฅ)๋Š” CSS๋ฅผ ํ–ฅ์ƒํ•˜๊ณ  ๋ณด์™„ํ•˜๊ธฐ ์œ„ํ•œ ํ™•์žฅ ์–ธ์–ด์ž…๋‹ˆ๋‹ค. ๋ณ€์ˆ˜, ์ค‘์ฒฉ ๊ทœ์น™, ๋ฏน์Šค์ธ ๋“ฑ์˜ ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•˜์—ฌ ์ฝ”๋“œ์˜ ์žฌ์‚ฌ์šฉ์„ฑ์„ ๋†’์ด๊ณ  ๊ฐ€๋…์„ฑ์„ ๊ฐœ์„ ํ•ฉ๋‹ˆ๋‹ค. 1.2 ๋ฐฐ๊ฒฝ Sass/Scss๋Š” CSS์˜ ํ•œ๊ณ„๋ฅผ ๊ทน๋ณตํ•˜๊ธฐ ์œ„ํ•ด ๋งŒ๋“ค์–ด์กŒ์Šต๋‹ˆ๋‹ค. ๊ธฐ์กด์˜ CSS๋Š” ๋ณ€์ˆ˜, ์ค‘์ฒฉ, ํ•จ์ˆ˜ ๋“ฑ์˜ ๋ถ€์กฑํ•œ ๊ธฐ๋Šฅ์œผ๋กœ ์ธํ•ด ์ฝ”๋“œ์˜ ๋ณต์žก์„ฑ์ด ์ฆ๊ฐ€ํ•˜๊ณ  ์œ ์ง€๋ณด์ˆ˜๊ฐ€ ์–ด๋ ค์› ์Šต๋‹ˆ๋‹ค. Sass/Scss๋Š” ์ด๋Ÿฌํ•œ ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•˜๊ณ ์ž ๊ฐœ๋ฐœ๋˜์—ˆ์Šต๋‹ˆ๋‹ค. 2. Sass/Scss์˜ ํŠน์ง• 2.1 ๋ณ€์ˆ˜ $primary-color: #3498db; body { backgroun.. 2024. 2. 21.