css給body設定min-height為什麼沒有作用？

當網頁內容區content東西很少時，footer就會跑到上邊？
我給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%是根據他的父元素來做比較的,例如，

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

回到樓主的問題，所以html只能設定固定的高度，設定body高度百分比的話，那你先設定html元素的高度！

以上是css給body設定min-height為什麼沒有作用？的詳細內容。更多資訊請關注PHP中文網其他相關文章！