float1 [CSS] ๋ ์ด์์ ๋ฐฐ์น ์ ํ 3๊ฐ์ง ์์๋ณด๊ธฐ ๋ ์ด์์(Layout) ์น์ ๊ตฌ์ฑํ๋ ์์๋ค์ ๋ณด๋ค ์์๋ณด๊ธฐ ์ฝ๊ฒ ํจ๊ณผ์ ์ผ๋ก ๋ฐฐ์น์์ผ์ฃผ๋ ์์ ์ ๋๋ค. ๋ ์ด์์์ 3๊ฐ์ง ์ ํ ๋ ์ด์์์๋ Float, Flex, Grid๋ผ๋ ์ด 3๊ฐ์ง ์ ํ(๋ฐฉ๋ฒ)์ด ์์ต๋๋ค. ์ฌ์ฉ ๋ฐฉ๋ฒ์ ์๋์ ๊ฐ์ผ๋ฉฐ 1๋ฒ์ ๊ฒฝ์ฐ ์ ๋ ฌํ๊ณ ์ ํ๋ ์์์, 2·3๋ฒ์ ๊ฒฝ์ฐ๋ ๋ถ๋ชจ ํ๊ทธ์ ์ ์ต๋๋ค. 1. float: left; 2. display: flex; 3. display: grid; 01. Float Float๋ '๋์ฐ๋ค'๋ผ๋ ์๋ฏธ๋ฅผ ์ง๋๋ฉฐ ๋ ์ด์์์ ํ์ ์ก์ ๋ ์ฌ์ฉ๋ฉ๋๋ค. ๋ ์ด์์์ ํ์ ์ก์ ๋์๋ ํ๊ทธ๊ฐ ์ฌ์ฉ๋ฉ๋๋ค. ํ์ง๋ง ํด๋น ํ๊ทธ๋ block ํ์์ด๊ธฐ ๋๋ฌธ์ ์์๋ค์ด ๊ฐ๋ก๋ก ๋๋ํ ์ ๋ ฌ๋ ์ ์์ต๋๋ค. float: left; ์ด๋, ๋๋ํ ์ ๋ ฌํด์ฃผ๊ณ ์ ํ๋ ์์์ CSS.. 2022. 7. 25. ์ด์ 1 ๋ค์ ๋ฐ์ํ