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%是根据他的父元素来做比较的,比如，

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

回到楼主的问题，所以html只能设置固定的高度，设置body高度百分比的话，那你先设置html元素的高度！

以上就是css给body设置min-height为什么没有作用？的详细内容，更多请关注其它相关文章！

相关文章：

你感兴趣的文章：

标签云：