html - CSS 권위 있는 가이드의 질문(상자 모델 관련)

Question

으아아아

Answer 1

사진에 뭔가 문제가 있는 것 같은데, 맥락이 있는지 모르겠네요

1. 사진설명 여백은 마진을 참고해야 하는데 p가 설정되어 있지 않고 기본값은 0

2. 은색 부분 약 30px+20px = 50px, 두 개의 p가 20px로 분리되어 있으므로 5:2 관계여야 하며 사진의 육안 검사는 2:1입니다

3. p 패딩은 0입니다. 글꼴이 특별한 경우를 제외하고 텍스트는 왼쪽에 가까워야 하며 문자 p는 아래쪽 가장자리에 가까워야 합니다

Answer 2

상위 요소의 패딩 상단은 하위 요소를 아래로 밀어내고,
하위 요소의 여백 상단은 아래로 이동하여 여백을 남깁니다.
따라서 하위 요소의 margin-top -10px가 위로 10px 이동하더라도
상위 요소가 padding-top 10px를 추가하더라도 하위 요소도 오프셋되어 10px 아래로 이동하므로 움직이지 않습니다