我有一个包含“7px header”、“540px content”和页脚的页面 我希望页脚高度取决于页面高度变化和页面无滚动。 例子
if page height 700px;
footer 153px
or if page height 800px
footer 253px
我可以这样做吗?我使用下面的代码但不起作用
#header{
width:100%;
height:7px;
}
#content{
width:960px;
height:54px;
margin:0 auto 0;
}
#footer{
width:100%;
background-color:#aeb0b3;
height:100%;
position: relative;
bottom:0;
}
最佳答案
如果你不担心 IE8 浏览器,那么你可以使用 CSS 中的 calc
函数。
#footer{
width:100%;
background-color:#aeb0b3;
height:calc(100% - 547px);
position: relative;
bottom:0;
}
我希望你已经将 body 和 html 元素的宽度和高度设置为 100%,如下所示。
body, html{height:100%; margin:0; padding:0;}
关于css - 自动页脚高度与页面高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25114035/