--- title: CSS Basic Box Model slug: Web/CSS/CSS_Box_Model tags: - CSS - CSS Box Model - Overview - Reference translation_of: Web/CSS/CSS_Box_Model ---
{{CSSRef}}

CSS Basic Box Model은 각 요소에 대해 시각적 서식 모델에 따라 생성하고 배치하는 사각형 박스(안팎 여백 포함)를 위한 CSS 모듈입니다.

참고서

속성

박스 내 콘텐츠 흐름을 제어하는 속성

박스 크기를 제어하는 속성

박스의 바깥 여백을 제어하는 속성

박스의 안쪽 여백을 제어하는 속성

기타 속성

안내서

CSS 박스 모델 입문
CSS의 기초 개념 중 하나인 박스 모델을 설명합니다. 박스 모델은 CSS가 요소와 요소의 콘텐츠, 안쪽 여백, 테두리, 바깥 여백 영역을 배치하는 법을 정의합니다.
여백 상쇄 정복
어떤 경우, 두 개의 인접한 바깥 여백은 하나로 상쇄됩니다. 이 글은 상쇄가 언제 어떻게 일어나고 이를 어떻게 제어하는지 설명합니다.
시각적 서식 모델
시각적 서식 모델을 설명합니다.

명세

명세 상태 설명
{{SpecName("CSS3 Box")}} {{Spec2("CSS3 Box")}} margin-trim 추가.
{{SpecName("CSS2.1", "box.html")}} {{Spec2("CSS2.1")}}  
{{SpecName("CSS1")}} {{Spec2("CSS1")}} 초기 정의