CSS에서 신체에 대한 최소 높이 설정이 효과가 없는 이유는 무엇입니까?

웹페이지의 콘텐츠 영역에 콘텐츠가 거의 없으면 바닥글이 맨 위로 올라가나요?
body와 html에 min-height:100%를 설정했지만 효과가 없습니다.
height: 100%로 설정하면 괜찮지만 콘텐츠가 너무 많으면 한 화면에 다 들어가나요?

body,html{   min-height:100%;
}body{   position:relative;
}.content{  podding-bottom:100px;
}.footer{position:absolute;bottom:0;left:0;height:100px;
}

다음과 같이 작성하세요:

html {    
height: 100%;
}
body {    
position: relative;    
min-height: 100%;   
 box-sizing: border-box;    
 padding-bottom: 80px; /* .footer 的高度，为 footer 占位 */}
 .footer {    
 position: absolute;    
 bottom: 0;    
 left: 0;    
 width: 100%;    
 height: 80px;
}

위 코드는 IE8 이상과 호환됩니다

나도 이런 문제가 발생하여 다음과 같이 해결했습니다.

html,body，.content{    
min-height:100%;
}
html{    
-ms-text-size-adjust: 100%;    
-webkit-text-size-adjust: 100%;
}
body{    
background:#eeeeee;
}

그런 다음 js를 사용하여 $(".content"를 제어합니다. ) .height($("html").height); 비교를 위해 상위 요소를 기준으로 이 조정이 100% 더 안정적이라고 생각합니다. 고정 높이를 설정하고 본문 높이 백분율을 설정할 수 있다면 먼저 html 요소의 높이를 설정하세요!

위 내용은 CSS에서 신체에 대한 최소 높이 설정이 효과가 없는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!