[16] Flexbox (flex-direction, flex-wrap, flex-flow, justify-content, align-items, align-content, align-self, flex item order, flex-grow, flex-shrink, flex-basis, flex)
반응형 웹사이트를 디자인할 때 요소가 웹사이트를 사용하는 장치 유형에 따라 너비, 높이, 해상도, 방향 등과 같은 동작을 변경하기를 원할 것이다.이번에는 flexbox 레이아웃을 사용하여 요소를 반응형으로 만드는 방법에 대해 설명하겠다. flexbox란?CSS Flextbox는 요소를 효율적이고 동적으로 배열할 수 있는 레이아웃 모델이다.이 레이아웃은 1차원이며 공간이 균등하게 분산된 컨테이너 내부에 요소를 배치할 수 있다.또한, 요소를 반응형으로 만든다.즉, 요소를 표시하는 장치의 종류에 따라 요소의 동작이 변경된다.요소를 유연하게 만들고 적절한 위치와 대칭을 제공한다.Flexbox는 컨테이너의 항목을 보다 효율적이고 동적으로 정렬하기 위해 CSS 버전 3에 도입되었다.Flexbox 이전에는 처음에 아..
2024. 11. 23.
