목록flex 사용법 (1)

열정 실천

[CSS 009] FLEX 사용법 (여러가지 속성과 속성 값 모음)

가로 배치를 손쉽게 하기 위한 방법으로 Flex (Flexible Box, Flexbox)가 있다. float나 inline-block 을 이용했던 기존 방식보다 훨씬 편리하게 레이아웃을 배치할 수 있다. display: flex; 를 부모 요소에 선언하면 그 안에 있던 자식 요소들은 모두 flex 컨테이너의 item이 된다. 이 flex 아이템들은 가로 방향으로 배치되고, 자신이 가진 내용물의 width만큼만 차지하게 된다. 마치 inline 요소로 바뀌는 것과 같다 height는 컨테이너의 높이만큼 늘어난다. Flex container는 여러가지 속성이 있다. justify-content , align-items, flex-direction , flex-wrap , align-content, flex..
개발 공부/CSS 2023. 4. 6. 19:41
이전 Prev 1 Next 다음