CSS : Box Model이란?

• Box Model

※ 정의
- 박스 모델은 웹 페이지의 레이아웃을 구성하는 데 사용되는 개념 중 하나이다.
- 웹 페이지의 모든 HTML 요소는 사각형의 "박스"로 간주되며, 각각의 박스는 여러 영역으로 나누어진다.

※ 영역 구분
- contents : 실제 내용이 표시되는 영역
- padding : 내부 여백
- border : 테두리
- margin : 외부 여백

※ 참고 사이트

- border : https://developer.mozilla.org/ko/docs/Web/CSS/border
- padding : https://developer.mozilla.org/ko/docs/Web/CSS/padding
- margin : https://developer.mozilla.org/ko/docs/Web/CSS/margin

※ Inline 요소 주의 사항
- 인라인 요소는 width, height, margin-top, margin-bottom, padding-top, padding-bottom 속성이 적용되지 않는다.