플렉스1 CSS-레이아웃Ⅲ: Flex box Layout (플렉스 박스) [ Flexbox ] Flexbox는 모던 웹을 위하여 제안된 기존 layout보다 더 세련된 방식의 새로운 layout 방식이다. 요소의 사이즈가 불명확하거나 동적으로 변화할 때에도 유연한 레이아웃을 실현할 수 있다. 복잡한 레이아웃이라도 적은 코드로 보다 간단하게 표현할 수 있다. flex layout은 요소들이 포함된 큰 박스에 flex를 선언하고, 안에 있는 요소들에게는 유연하게 배치하는 속성들을 부여하여 레이아웃을 잡는 것이다. div 요소는 block 요소이므로 수직 정렬된다. 1 2 3 4 5 ㅁㄴㅇㄻㄴㅇㄻㄴㅇㄻㄴㅇㄻㄴㅇㄻㄴㅇㄻㄴㅇㄹ 이를 수평 정렬하려면 자식 요소(flex-item)를 inline-block으로 지정하거나 float 프로퍼티를 지정해야 하는데 각 자식 요소의 너비를 %로 지.. 2020. 8. 29. 이전 1 다음