박스 모델 크기 계산 지도

요소의 실제 크기는 content, padding, border, margin이 어디에 포함되는지에 따라 달라진다. `box-sizing`을 먼저 확인하면 레이아웃 예측이 쉬워진다.

1

핵심 1

박스 모델 크기 계산 지도 박스 모델 크기 계산 지도 요소의 실제 크기는 content, padding, border, margin이 어디에 포함되는지에 따라 달라진다…

2

핵심 2

`box-sizing`을 먼저 확인하면 레이아웃 예측이 쉬워진다.

3

핵심 3

margin border padding content content-box 지정한 width는 콘텐츠만 뜻한다.

4

핵심 4

padding과 border가 바깥으로 더해진다.

핵심박스 모델 크기 계산 지도은 각 요소의 관계와 선택 조건을 함께 읽어야 한다.