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

ui1

โœˆ [๋ฐ˜์‘ํ˜• ์›น ๊ธฐ์ดˆ] @media screen and (max-width:620px) and (min-width:300px) ๋ฐ˜์‘ํ˜• ์›น์˜ ๊ธฐ์ดˆ @media screen and (max-width:620px) and (min-width:300px) ๋ฐ˜์‘ํ˜• ์›น์— ๋Œ€ํ•ด ๋‘๋ ค์›€์„ ๊ฐ–๊ณ  ์žˆ๋Š” ํผ๋ธ”๋ฆฌ์…”๋“ค์ด ์ œ๋ฒ• ๋งŽ๋‹ค. ์‚ฌ์‹ค ์•Œ๊ณ  ๋ณด๋ฉด ๋ณ„๊ฑฐ ์•„๋‹ˆ๋‹ค. ๊ฐ€๋กœํญ์— ๋Œ€ํ•œ ์‹œ๋‚˜๋ฆฌ์˜ค๋Œ€๋กœ CSS๋ฅผ ์ ์šฉํ•ด์ฃผ๋ฉด 90%(?)๋Š” ๋๋‚œ ๊ฒŒ์ž„์ด๋‹ค. ๋ฌผ๋ก  ๊ทธ ๊ณผ์ •์€ ์ฝ”๋”ฉ๋‹ต๊ฒŒ ๋…ธ๊ฐ€๋‹ค์ด๊ธด ํ•˜๋‹ค. ๊ฐ™์€ ์Šคํƒ€์ผ์— ๋Œ€ํ•ด 2๋ฒˆ ์ด์ƒ์„ ๊ธฐ์ˆ ํ•ด์ค˜์•ผ ํ•˜๋Š” ์ž‘์—…์ด๋‹ˆ๊นŒ ๋ง์ด๋‹ค. ๋‚˜๋จธ์ง€ 10%๋Š”? ๋ฐ˜์‘ํ˜•์›น์„ ์›ํ•˜๋Š” ํด๋ผ์ด์–ธํŠธ์˜ ๊ธฐ๋ฐœํ•˜๊ณ ๋„ ์ฐฝ์˜์ ์ด๋ฉด์„œ ๊ฐ€ํ•™์ ์ธ ๋ˆˆ๋†’์ด์— ๋งž์ถฐ์ฃผ๊ธฐ ์œ„ํ•ด์„œ๋Š” ๋‹จ์ง€ CSS์˜ @media screen ๋งŒ์œผ๋กœ๋Š” ํ•ด๊ฒฐ๋˜์ง€ ์•Š๋Š” ๋‚œ์ œ๋“ค์ด ํŠ€์–ด๋‚˜์˜ฌ ๋•Œ๊ฐ€ ์žˆ๋‹ค. ๊ทธ๋Ÿด ๋• ํ•˜๋Š” ์ˆ˜ ์—†์ด jQuery์˜ ๋„์›€์„ ๋ฐ›์•„์•ผ ํ•œ๋‹ค. ํ•˜์ง€๋งŒ ์™ ๋งŒํ•˜๋ฉด @media screen์œผ๋กœ ๋Œ€๋ถ€๋ถ„.. 2019. 7. 27.