1. display: flex
container
2. flex-direction: row; column, row-reverse, column-reverse;
3. flex-wrap: nowrap; wrap, wrap-reverse;
4. flex-flow: row wrap; - flex-direction과 flex-wrap을 동시에 지정
flex-flow: row nowrap;
justify
5. justify-content: flex-start; flex-end, center, space-between, space-around, space-evenly
align
6. align-items: stretch; flex-start, flex-end, center, baseline;
7. align-content: stretch; flex-start, flex-end, center, space-between, space-around, space-evenly;
item
8. flex-basis: auto(해당 아이템의 width), 0, 50%, 300px, 10rem, content(컨텐츠의 크기);
9. flex-grow: 1, 0
.item:nth-child(1) { flex-grow: 1; }
.item:nth-child(2) { flex-grow: 2; }
.item:nth-child(3) { flex-grow: 1; }
10. flex-shrink: 1
11. flex: flex-grow, flex-shrink, flex-basis를 한 번에 쓸 수 있는 축약형
12. align-self: auto, stretch, flex-start, flex-end, center, baseline;
13. order
14. z-index