콘텐츠를 사용하지 않고 DIV 요소를 페이지 하단까지 확장하려면 어떻게 해야 합니까?

내용 없이 페이지 하단까지 DIV 블록을 강제 확장

내용 없이 페이지 하단까지 DIV 블록을 확장하는 것은 어려울 수 있습니다. . 이를 달성하려면 먼저 DIV의 유연성 제한을 해결해야 합니다.

문제 이해

주어진 마크업에서 "content" DIV는 다음으로 확장되지 않습니다. 컨테이너인 "menuwrapper" DIV의 높이가 100%가 아니기 때문입니다. 콘텐츠 DIV는 컨테이너 크기에 의해 제한됩니다.

해결책

이 문제를 해결하기 위해 우리는 컨테이너 DIV("menuwrapper")가 다음으로 확장되도록 CSS를 수정합니다. 페이지의 전체 높이:

html, body {
    height: 100%;
}

이것은 HTML과 본문 요소를 모두 다음으로 설정합니다. 100% 높이, 컨테이너 DIV가 페이지의 전체 세로 공간을 채우도록 합니다.

추가 고려 사항

브라우저에 따라 다음과 같은 추가 조정이 필요할 수 있습니다. 여백이나 패딩을 수정하는 것과 같습니다. 자세한 내용은 다음 리소스를 참조하세요. 지원:

• http://www.brunildo.org/test/html_body_0.html
• http://www.bruni ldo.org/test/html_body_11b.html
• http://www.brunildo.org/test/index.html

의 경우 CSS 높이에 대한 종합적인 정보는 http://quirksmode.org/를 방문하세요.

위 내용은 콘텐츠를 사용하지 않고 DIV 요소를 페이지 하단까지 확장하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!