몸체 요소 배경 스타일이 전체 뷰포트에 영향을 미치는 이유는 무엇입니까?

Body 요소의 배경 스타일이 전체 뷰포트에 미치는 영향

Body 요소의 배경 스타일을 지정할 때 개발자는 스타일이 뷰포트를 넘어 확장되는 예상치 못한 효과를 경험할 수 있습니다. body 요소이며 전체 뷰포트를 덮습니다. 이 동작은 CSS의 루트 요소인 body 요소의 역할에서 비롯됩니다.

W3C의 CSS 표준에 설명된 사양에 따르면 루트 요소(이 경우 body 요소)에 배경 스타일이 적용됩니다. 웹페이지의 전체 캔버스에 영향을 미칩니다. 이 캔버스는 브라우저의 뷰포트에서 사용 가능한 표시 영역을 포함하며 본문 요소의 경계를 넘어 확장됩니다.

제공된 예에서:

body {
  width: 700px;
  height:200px;
  border: 5px dotted red;
  background-color: blue;
}

너비 및 높이 속성은 특별히 다음에 적용됩니다. 예상대로 body 요소입니다. 그러나 body 요소는 루트 요소이고 배경 스타일은 CSS 사양에 따라 전체 캔버스에 영향을 주기 때문에 배경색은 전체 화면에 걸쳐 적용됩니다.

기본적으로 body 요소의 배경은 본문 요소 자체의 스타일만 지정하는 것이 아니라 브라우저에서 전체 웹페이지 영역의 배경을 지정합니다. 이는 CSS에서 루트 요소의 배경 스타일 지정과 관련된 고유한 동작을 보여줍니다.

위 내용은 몸체 요소 배경 스타일이 전체 뷰포트에 영향을 미치는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!