728x90
프론트엔드/CSS
-
CSS의 flex-grow, flex-shirink, flex-basis에 대해서프론트엔드/CSS 2024. 4. 15. 21:25
CSS의 flex-grow, flex-shirink, flex-basis에 대해서 flex 속성은 CSS의 Flexbox 레이아웃을 사용할 때 유용한 속성 중 하나입니다. Flexbox는 요소의 크기와 순서를 유연하게 조절하여 레이아웃을 구성하는 데 도움이 됩니다. flex-grow: 이 값은 유연한 공간을 얼마나 차지할 지를 결정합니다. 즉, 해당 아이템이 늘어나는 비율을 설정합니다. 기본값은 0입니다. 값이 0이면, 유연한 공간에서 아이템이 늘어나지 않습니다. 값이 양수이면, 다른 flex 아이템보다 더 많이 늘어납니다. 모든 flex 아이템의 flex-grow 값이 1인 경우, 유연한 공간을 모두 차지하며 동일한 비율로 늘어납니다. 값이 클수록 해당 아이템이 더 많은 공간을 차지합니다. flex-s..