[CSS] ๋ฐ์ํ ์น ๋ฏธ๋์ด ์ปค๋ฆฌ(@media) โ๏ธ
ยท
CSS
๐จ๐ป ๋ฏธ๋์ด ์ปค๋ฆฌ๋?๋ฐ์ํ ์น ๋์์ธ์์ ๊ฐ์ฅ ๊ธฐ๋ณธ์ ์ธ ๊ฐ๋
์ผ๋ก ์ฌ์ดํธ์ ์ ์ํ๋ ์ฅ์น์ ๋ฐ๋ผ ํน์ ํ CSS ์คํ์ผ์ ์ฌ์ฉํ๋ ๋ฐฉ๋ฒ์ด๋ค.์๋ ์์ ์ฌ์ง ์ฒ๋ผ, ๋ฏธ๋์ด ์ปค๋ฆฌ๋ ๋ค์ํ ๊ธฐ๊ธฐ์ ํ๋ฉด ํฌ๊ธฐ์ ๋์ํ์ฌ ์น ์ฌ์ดํธ๋ฅผ ๋ ํจ๊ณผ์ ์ผ๋ก ํํํ ์ ์๊ฒ ํ๋ค.๋ฏธ๋์ด ์ปค๋ฆฌ๋ ์ฌ์ด์ ์ฌ์ฉํ๋ฉฐ ๊ธฐ๋ณธ์ ์ผ๋ก ๋ฏธ๋์ด ์ ํ์ ์ง์ ํ๊ณ ํ์ํ ๊ฒฝ์ฐ์๋ and ์ฐ์ฐ์๋ก ์กฐ๊ฑด์ ์ ์ฉํ๋ค.1. ์น ํ์ด์ง์ ์ต๋ ๊ฐ๋ก ๋๋น(max-width)๊ฐ 980px ์ดํ์ธ ๊ฒฝ์ฐ@media screen and (max-width:980px) { #page { width: 94%;} #main {width: 65%;} #sidebar {width: 30%;}}2. ์น ํ์ด์ง์ ์ต๋ ๊ฐ๋ก ๋๋น(max-width)๊ฐ 70..