1. min-width (์ต์ ๋๋น)
"์ด ํฌ๊ธฐ ์ด์์ผ ๋ ์ ์ฉ"์ ์๋ฏธ.
์ฃผ๋ก PC์ฒ๋ผ ํ๋ฉด์ด ๋์ ํ๊ฒฝ์ ์คํ์ผ์ ์ ์ฉํ ๋ ์ฌ์ฉ
2. max-width (์ต๋ ๋๋น)
"์ด ํฌ๊ธฐ ์ดํ์ผ ๋ ์ ์ฉ"์ ์๋ฏธ.
์ฃผ๋ก ๋ชจ๋ฐ์ผ์ฒ๋ผ ํ๋ฉด์ด ์์ ํ๊ฒฝ์ ์คํ์ผ์ ์ ์ฉํ ๋ ์ฌ์ฉ.
์ด๋ป๊ฒ ํ์ฉํ๋๋๊ฐ ์ค์
๋ชจ๋ฐ์ผ์ ๊ธฐ๋ณธ์ผ๋ก ์ก๊ณ , PC ์คํ์ผ์ ๋ฐ๋ก ๋ฎ์ด์ฐ๊ณ ์ถ๋ค๋ฉด **min-width**๋ฅผ ์ฃผ๋ก ์ฌ์ฉ
๋ฐ๋๋ก PC๋ฅผ ๊ธฐ๋ณธ์ผ๋ก ์ก๊ณ , ๋ชจ๋ฐ์ผ ์คํ์ผ์ ๋ฐ๋ก ๋ฎ์ด์ฐ๊ณ ์ถ๋ค๋ฉด **max-width**๋ฅผ ์ฌ์ฉ
์์ ๐ฏํ
๋ชจ๋ฐ์ผ ์ฐ์ ์ ๋ต:
์์ ํ๋ฉด(๋ชจ๋ฐ์ผ)์ ๊ธฐ๋ณธ ์คํ์ผ๋ก ์์ฑํ ๋ค, ํ๋ฉด์ด ์ปค์ง์๋ก (min-width) ์คํ์ผ์ ์ถ๊ฐ๋ก ๋ฎ์ด์ฐ๊ธฐ
์ฅ์ : ์์ฆ ๋ชจ๋ฐ์ผ ์ฌ์ฉ์๊ฐ ๋ง์ผ๋๊น ๊ธฐ๋ณธ ์ค์ ์ผ๋ก ํจ์จ์ .
PC ์ฐ์ ์ ๋ต:
ํฐ ํ๋ฉด(PC)์ ๊ธฐ๋ณธ ์คํ์ผ๋ก ์์ฑํ ๋ค, ํ๋ฉด์ด ์์์ง์๋ก (max-width) ์คํ์ผ์ ๋ฎ์ด์ฐ๊ธฐ
์ฅ์ : PC ์ค์ฌ์ ๋์์ธ์ ์ ํฉ.
'TIP' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
textarea ์ปค์ ์ด์ํ ์์น์์ ๊น๋นก์ผ ๋ ํด๊ฒฐ๋ฒ (0) | 2025.01.16 |
---|---|
ํฐ์คํ ๋ฆฌ ๋ง์ฐ์ค ์ปค์ ํจ๊ณผ (0) | 2025.01.06 |
ํน์๋ฌธ์ ์ด๋ชจํฐ์ฝ ์ฌ์ดํธ (1) | 2025.01.05 |
css ๊ธ์จ ํ๊ทธ (0) | 2022.10.01 |
favicon ์ฌ์ฉํ๊ธฐ (0) | 2019.09.01 |