CSS Box Model?

CSS box model은 block box에 적용된다 인라인 박스(인라인요소)는 박스 모델에 정의된 일부 동작만 사용한다

Box 구성

• 콘텐츠 박스
  width 와 height같은 속성

• padding 박스
  콘텐츠 주변을 마치 공백처럼 자리잡는다

• 테두리 박스
  테두리 박스는 콘텐츠와 padding까지 둘러싼다
  border와 관련속성을 사용하여 제어할 수 있다

• 여백 박스
  Margin은 가장 바깥 쪽 레이어로 모두를 둘러싸고 box와 다른 요소 사이의 공백역할을 한다
  

.box {
  width: 350px;
  height: 150px;
  margin: 25px;
  padding: 25px;
  border: 5px solid black;
}

box model예시