FLEXBOX

Flexbox Froggy

Flex를 배우기

1. justify-content Flex 요소들을 가로선상에서 정렬

• flex-start flex-end center
• space-around 요소 주위 간격 space-between 요소 사이 간격이 일정

2. align-items Flex 요소들을 세로선상에서 정렬

• baseline stretch

3. align-self

• 요소들이 아닌 자신을 정렬

4. align-content

• 여러 줄 사이의 간격을 지정
• stretch (기본) 여러 줄들을 컨테이너에 맞도록 늘린다.

5. flex-directrion

• column → jusify-content 와 algin-items 가로세로 방향이 달라진다
• reverse

6. order