๐ CSS
๐ฅ Resetting๊ณผ Normalizing CSS์ ์ฐจ์ด์ ์ ๋ฌด์์ธ๊ฐ์?โ
Resetting์ ์์์ ๋ชจ๋ ๊ธฐ๋ณธ ๋ธ๋ผ์ฐ์ ์คํ์ผ์ ์ ๊ฑฐํ๊ธฐ ์ํ ๊ฒ์
๋๋ค.
Normalizing์ ๋ชจ๋ ์คํ์ผ์ ์ ๊ฑฐํ๋ ๊ฒ์ด ์๋๋ผ ์ ์ฉํ ๊ธฐ๋ณธ ์คํ์ผ์ ๋ณด์กดํฉ๋๋ค. ๋ํ ์ผ๋ฐ์ ์ธ ๋ธ๋ผ์ฐ์ ์ข
์์ฑ์ ๋ํ ๋ฒ๊ทธ๋ฅผ ์์ ํ๋น๋ค.
๐ฅ * { box-sizing: border-box; }๋ ๋ฌด์์ ํ๋์? ์ฅ์ ์ ๋ฌด์์ธ๊ฐ์?โ
์ด ์์๋ width์ height๊ฐ ์ด๋ป๊ฒ ๊ณ์ฐ๋๋์ง๋ฅผ ๋ณ๊ฒฝํ์ฌ, border์ padding๋ ๊ณ์ฐ์ ํฌํจ๋ฉ๋๋ค. padding๊ณผ border๋ฅผ ๋ฐ์ค ๋ชจ๋ธ์ ์ผ๋ถ๋ถ์ผ๋ก ์๊ฐํ๋ฉด, ๋์์ด๋๊ฐ ์ค์ ๋ก ์๊ฐํ๋ ๊ฒ๊ณผ ์ ๋ค์ด ๋ง์ต๋๋ค.