๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
๋ฐ˜์‘ํ˜•

Column1

[CSS] Display์†์„ฑ_float, flex, grid float์†์„ฑ์„ ํ™œ์šฉํ•˜์—ฌ ๋ ˆ์ด์•„์›ƒ ์ปจํ…Œ์ด๋„ˆ ๋‚ด์˜ ์•„์ดํ…œ๋“ค์„ ์›ํ•˜๋Š” ๊ณต๊ฐ„์œผ๋กœ ๋ฐฐ์น˜ํ•  ์ˆ˜ ์žˆ๋‹ค. flex์„ ํ™œ์šฉํ•˜์—ฌ ํ™”๋ฉด์˜ ํฌ๊ธฐ์— ๋”ฐ๋ผ item๋“ค์„ ์œ ๋™์ ์œผ๋กœ ๋ฐฐ์น˜ํ•  ์ˆ˜ ์žˆ์œผ๋ฉฐ, grid๋ฅผ ํ™œ์šฉํ•˜์—ฌ ์ปจํ…Œ์ด๋„ˆ๋ฅผ ๋‹ค์–‘ํ•œ ๋ชจ์–‘์œผ๋กœ ๋ฐฐ์น˜ํ•  ์ˆ˜ ์žˆ๋‹ค. 1. float : ๊ตฌ์กฐ๋ฅผ ์ œ๋Œ€๋กœ ์งฐ๋”๋ผ๋„, ํ•œ๊ฐœ์˜ ํƒœ๊ทธ ๋‚ด๋ถ€์—์„œ๋„ ์—ฌ๋Ÿฌ ์š”์†Œ๋“ค์ด ์‚ฌ์šฉ๋˜์–ด ๋ฐฐ์น˜๊ฐ€ ์›ํ•˜๋Š”๋Œ€๋กœ ์–ด๋ ค์šธ ์ˆ˜ ์žˆ๋‹ค. ์ด๋•Œ float์†์„ฑ์„ ํ™œ์šฉํ•œ๋‹ค๋ฉด ์›ํ•˜๋Š” ๋ฐฐ์น˜๊ฐ€ ์ด๋ฃจ์–ด์งˆ ์ˆ˜ ์žˆ๋‹ค. 1) float float์œผ๋กœ item์„ ๋ฐฐ์น˜ํ•  ๋ฐฉํ–ฅ(์ขŒ, ์šฐ)์„ ์ง€์ •ํ•˜๊ณ , width์†์„ฑ์„ ํ™œ์šฉํ•˜์—ฌ ํ•ด๋‹น ๋ฐฉํ–ฅ์—์„œ์˜ ๋„“์ด ์ง€๋ถ„์œจ์„ ์ง€์ •ํ•˜๋ฉด ๋œ๋‹ค. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod .. 2022. 2. 11.
๋ฐ˜์‘ํ˜•

ํ‹ฐ์Šคํ† ๋ฆฌํˆด๋ฐ”