margin, padding, border 알아보기
- margin은 상자의 바깥쪽 여백을 말합니다.
- padding은 상자의 안쪽 여백을 말합니다.
- border는 상자의 테두리를 말합니다.
이 상자의 크기는 얼마일까요?
상자 넓이(500)+좌우 패딩(200)+좌우 보더(200) = 넓이 900px
상자 높이(200)+상하 패딩(200)+상하 보더(200) = 높이 600px
상자가 차지하는 공간은 마진까지 포함하여 넓이 1100px, 높이 800px
마진이 적용된 상자
패딩이 적용된 상자
보더가 적용된 상자