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 | 31 |
Tags
- react
- docker
- FIGMA
- git
- TypeScript
- 해시
- HTML
- render
- TAILWIND
- Stack
- webpack
- CSS
- 프로그래머스
- FigJam
- Next.js
- hook
- Javascript
- 피그마
- Babel
- 코딩테스트
- EC2
- useCallback
- Taillwind
- grid
- github
- axios
- express
- SSR
- useMemo
- 자료구조
Archives
- Today
- Total
목록2024/01/17 (1)
나는 오늘도 멋있다
Flex
목적 부트캠프 과정의 두번째 과제로 HTML과 CSS 만으로 Youtube의 홈부분을 flex로 구조를 잡는 과제였다. Flex는 항상 써왔다. 그래도 Flex의 각 속성에 대해 좀더 깊이이해하고 쓰자는 생각으로 이글을 작성한다. Flex란? 주로 CSS Flexbox 레이아웃을 만들때 사용되는 속성으로, 웹페이지의 레이아웃을 효율적으로 설계하고, 요소들을 유연하게 배치하기 위한 CSS 기술이다. Flex의 속성들 Flex의 Container는 부모요소를 뜻하고, Item은 자식요소를 뜻한다. Container 속성 속성명 설명 단위 속성 dispaly 부모요소를 Flexbox 컨테이너로 만든다. flex, inline-flex justify-content 주축의 요소들을 정렬한다. flex-start,..
Web/HTML&CSS
2024. 1. 17. 21:00