1. 개요CSS에서 모든 HTML 요소는 하나의 사각형 박스(Box)로 표현된다.이 박스는 요소의 실제 크기와 위치, 여백을 결정하며, 웹페이지의 전체 레이아웃을 구성하는 가장 기본적인 단위이다.이 글에서는 CSS 박스 모델의 구성 요소와 display 속성의 차이를 통해 레이아웃의 핵심 개념을 이해한다. 주로 div, section, article 에서 가장 많이 사용된다. 2. 내용2.1. 박스 모델(Box Model)의 구성 요소CSS 박스 모델은 다음과 같이 4개의 영역으로 구성된다.width / height : 내용(content)의 크기padding : 내용과 테두리 사이의 내부 여백border : 요소를 감싸는 테두리margin : 요소 바깥의 외부 여백 (다른 요소와의 거리)+-------..