플렉스1 HTML5 CSS3 홈페이지 스타일링 3 - 레이아웃속성 플렉스 flex display: flex; //화면 전체 너비를 기준으로 하여 비율에 맞춰 플렉스 아이템들을 배분합니다. flex 속성을 사용한 레이아웃 모델을 플렉스 박스 레이아웃이라고 합니다. box1 box2 box3 유연하게 배치할 요소의 부모 요소(플렉스 컨테이너)에 display 값을 flex로 정합니다. 자식 요소는 플렉스 아이템이라고 합니다. display: inline-flex; // 플렉스 아이템의 크기를 지정하지 않은 경우 플렉스 아이템의 내용 만큼 너비가 지정됩니다. 정렬 기준 속성은 flex-direction으로 flex-direction: row; // 가로축으로 정렬 flex-direction : column; //세로축으로 정렬 flex-direction: row-reverse; //가.. 2024. 6. 27. 이전 1 다음