CSS で min-height を body に設定しても効果がないのはなぜですか?

Webページのコンテンツ領域にコンテンツがほとんどない場合、フッターが上部に表示されますか?
bodyとhtmlにmin-height:100%;を設定しましたが、効果がありません
height:100%;を設定しても問題ありませんが、コンテンツが多すぎると1つの画面に収まりますか？

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%基づいています。たとえば、

<div style="width:100px;">
    <div style = "width:50%;"></div>
</div>

元の投稿者の質問に戻るので、HTMLのみです。固定の高さを設定し、本体の高さのパーセンテージを設定できる場合は、まず HTML 要素の高さを設定します。

以上がCSS で min-height を body に設定しても効果がないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。