flex 속성
- basis : 흐르는 방향의 넓이나 높이 담당
- grow : 넓이나 높이를 grow 수치의 크기만 큼 각 블럭의 넓이나 높이를
상대적으로 맡게 된다
ex) flex-grow:1; ↔ flex-grow:2; (더 많은 넓이or높이를 갖는다)
- shrink ( 줄어들다 ) :
ex) flex-shrink:0; 크기가 줄어들지 않음(전체화면 창의 크기를 줄여도..)
flex-shrink:1; ↔ flex-shrink:2; ( 상대적인 수치로 인해 1보다 2의 수치가 더 많이 넓이or높이가 줄어든다)
- align-items -baseline : 각 텍스트의 밑줄 라인을 맞춰준다
- ex) flex-1-0-0 : grow - shrink - basis
-order : 상대적인 수치를 사용해 순서를 변경
: 하나의 박스 안에 블럭들의 1번째 2번째.. 등을 순서로 생각을하고
ex) order:-1; , order:1; 등으로 입힌다.