728x90 CSS2 [ flex ] 부모 요소 / 자식 요소에 사용하는 flex 부모요소 display : flex 사용 (flex | inline-flex) flex-direction : 자식요소 수평 정렬 ( row | column ) flex-wrap : 자식요소 수직 정렬 ( nowrap | wrap-reverse ) justify-content : 자식요소 배치 방향 ( flex-start | flex-end | center | space-between | space-arount ) align-items : 너비를 줄이기, 줄바꿈 ( flex-start | flex-end | center | baseline | stretch ) align-content : 자식요소 여러 줄 일때 ( flex-start | flext-end | center | space-between | s.. 2022. 12. 30. [ flex ] 요소 정중앙에 배치하기 결과 화면 css body{ display: flex; justify-content: center; align-items: center; height: 100vh; } .box{ background-color: cadetblue; color: #fff; width: 200px; height: 200px; text-align: center; line-height: 200px; font-size: 2em; } html box 2022. 12. 30. 이전 1 다음 728x90 반응형