flex

오주형·2022년 10월 18일
0

https://www.youtube.com/watch?v=2BHyrE-nR3Q
https://flexboxfroggy.com/#ko 참고

flex 는 기본적으로 가로정렬할 때에 유용하다. 물론 세로 정렬도 할 수 있다.
부모 요소에 flex를 주면, 바로 아래 자식에게는 상속. 상속된 자식의 자식 요소에는 상속되지 않는다.

flex와 같이 알아두면 좋은 속성, justify-content. 가로.
space-around: 각 영역의 좌우 마진이 같다.
space-between: 양쪽 끝에 마진이 사라졌다. 간격을 같게. 사용 가장 많이 한다.
space-evenly: 모든 공간 동일.

align-items

flex-direction
row: flex의 디폴트 값이라고 할 수 있다. 가로 정렬.
column: 세로 정렬

flex-wrap
wrap: 여러 줄로 정렬

flex flow
flex wrap + flex-direction

align-content

profile
곧 개발자

0개의 댓글