[CSS] box-model ⭐️⭐️⭐️

박스모델이란?

: 모든 HTML요소는 박스(box)모양으로 구성되며, 이것을 box-model이라고 한다.

: 웹 문서 안에서 여러 요소를 원하는 위치에 배치하려면 CSS 박스모델을 잘 알고 있어야한다.

 

박스 모델의 기본 구성

• 콘텐츠 영역(content): 텍스트나 이미지가 들어 있는 박스의 실질적인 부분
• 패딩(padding): 내용과 테두리 사이의 간격, 눈에 보이지 않는다.
• 테두리(border): 내용과 패딩 주변을 감싸는 테두리
• 마진(margin): 테두리와 이웃하는 요소사이의 간격