Flexbox
-
HTML Page Layout : Flexbox로 레이아웃 잡기각종 학습 요약/Web 2022. 4. 28. 16:53
페이지 레이아웃 Flexbox로 레이아웃 잡기 display: flex 앞서 '기초 CSS의 이해 - 박스모델'에서 살펴봤듯, style 속성 display는 어떤 형식으로 보여질 건지, 박스모델의 display 방식을 결정하는 속성이다. Flex layout이란, 부모 엘리먼트의 박스모델을 display: flex로 속성값(강조한 이유가 있다, 일단 기억해두자)을 지정하고, 그 아래로 자식 엘리먼트들을 구성하는 레이아웃 구성 방식. Flex 요소(이하 '콘텐츠')들이 쌓이는 규칙 콘텐츠들은 기본적으로 수평으로 쌓인다('flex-direction의 기본값이 row다'라고 한다). 쌓는 방향(flex-direction)을 결정하는 속성값 두 가지: row, col..