CSS 영역에서 스크롤을 내리면 여러 개의 박스가 중첩된 그림이 등장합니다. 이를 박스 모델이라고 합니다. 박스 모델에 표시된 margin, border, padding, 숫자 영역에 마우스 포인터를 올리면 브라우저에서 해당 영역을 각각 확인할 수 있습니다.

그림 7-5처럼 margin 영역에 마우스 포인터를 올리면 브라우저 화면에서 margin 영역을 옅은 주황색으로 표시해 줍니다. 빨간색 테두리를 기준으로 바깥쪽 영역이 margin 영역입니다.

 

그림 7-5 마우스 포인터를 margin에 올리기