CSS/속성 - flex
Flex Containers 속성 - flex-flow, flex-direction
컴공 윤서혜 학습일기
2021. 1. 13. 13:39
flex-flow
이 속성은 단축 속성으로 Flex Items의 주 축(main-axis)을 설정하고 Items의 여러 줄 묶음(줄 바꿈)도 설정한다.
flex-flow: 주축 여러줄묶음;.flex-container {
flex-flow: row-reverse wrap;
}| 값 | 의미 | 기본값 |
| flex-direction | items의 수 축(main-axis)을 설정 | row |
| flex-wrap | items의 여러 줄 묶음(줄 바꿈) 설정 | nowrap |
flex-direction
Items의 주 축(main-axis)을 설정합니다.
| 값 | 의미 | 기본값 |
| row | Items를 수평축(왼쪽에서 오른쪽으로)으로 표시 | row |
| row-reverse | Items를 row의 반대 축으로 표시 | |
| column | Items를 수직축(위에서 아래로)으로 표시 | |
| column-reverse | Items를 column의 반대 축으로 표시 |
flex-direction: 주축;