Notice
Recent Posts
Recent Comments
Link
์ผ | ์ | ํ | ์ | ๋ชฉ | ๊ธ | ํ |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
Tags
- fe
- react
- ์ฝ๋ฉํ ์คํธ
- error
- HTML
- ๊ทธ๋ฆฌ๋
- ์๊ณ ๋ฆฌ์ฆ
- CSS
- ํ์ด์ฌ
- ํฌ๋กค๋ง
- javascript
- heapq
- mongodb
- ํ ์ดํ๋ก์ ํธ
- ๊ฐ๋ฐ
- ๊ตญ๋น์ง์
- ๋ฐฑ์ค
- Python
- ๋๋ฆผ์ฝ๋ฉ
- ํ๋ก ํธ์๋
- ์ฝ๋ฉ์ ํ
- ๋ ธ๋ง๋์ฝ๋
- ์ฝ๋ฉ
- node.js
- ํ๋ก์ ํธ
- ๋ชจ๊ฐ์ฝ
- Til
- KDT
- ํ๋ก๊ทธ๋๋จธ์ค
- JS
Archives
- Today
- Total
๋ชฉ๋กflexbox (1)
๐ฑ → ๐ณ
[CSS] Flexbox
Container container ์์ฑ๊ฐ๋ค display flex-direction flex-wrap flex-flow justify-content flex-start: ์์๋ค์ ์ปจํ ์ด๋์ ์ผ์ชฝ์ผ๋ก ์ ๋ ฌ flex-end: ์์๋ค์ ์ปจํ ์ด๋์ ์ค๋ฅธ์ชฝ์ผ๋ก ์ ๋ ฌ center: ์์๋ค์ ์ปจํ ์ด๋์ ๊ฐ์ด๋ฐ๋ก ์ ๋ ฌ space-between: ์์๋ค ์ฌ์ด์ ๋์ผํ ๊ฐ๊ฒฉ์ ๋ space-around: ์์๋ค ์ฃผ์์ ๋์ผํ ๊ฐ๊ฒฉ์ ๋ align-items align-content Item item ์์ฑ ๊ฐ๋ค order: item ์์ flex-grow : ๊ณ ์ ํ ์ฌ์ด์ฆ ์ ์ง(0), ๋ฐ์ค์ ๋ง๋๋ก ๋ณ๊ฒฝ(1) flex-shrink: container size ์์์ง ๋ ์ด๋ป๊ฒ ์์์ง์ง ์ค์ flex-basis: item์ด..
Client/HTML CSS
2022. 5. 10. 13:58