✏️공부한것
flex
flex-direction: row // 수평정렬
flex-direction: column // 수직정렬
flex: // flex: 0 1 auto; //기본값
flex는 부모자식에 적용할시 자식까지 적용이되고
grow, shrink는 단위가 없으며, 비례하는 값입니다. 박스를 여러개로 나누었을 때, 각 자식 박스가 갖는 grow값의 총 합이 n이라고 칩시다. 이 때의 1은 1/n의 크기를 의미합니다, 2는 2/n의 크기를 의미합니다.
grow
grow 값은 비율
target의 grow 속성이 1, .box의 grow 속성이 1일 경우, 1+1+1로 박스가 만들어지므로, 속성 1은 1/3의 크기
target의 grow 속성이 2, .box의 grow 속성이 1일 경우, 2+1+1로 박스가 만들어지므로, 속성 1은 1/4의 크기
shrink
보통 shrink는 기본값인 1로 두어도 무방
basis
박스가 grow나 shrink에 의해 늘어나거나 줄어들기 전 갖게 되는 기본 크기를 의미합니다. grow가 0일 때, basis 크기를 지정하면 그 크기는 보장됩니다.
flex 0 0 0
basis 를 auto로하면 컨텐츠 크기만큼 비율을 먹어버림
