使页面内容不跨越固定的页脚

时间:2015-12-17 21:13:06

标签: html css css3

在我的网站上,我的页面底部有一个固定的页脚,因此它始终可见。

以前是30px的高度所以我所做的是在每个页面的margin-bottom: 50px上设置#container,这样内容永远不会被我的页脚隐藏,如果它通过了50px保证金标记,然后你有机会向下滚动,工作正常。

但这是我的问题,我最近更改了我的页脚,现在大约是70px的高度,所以我必须更改每个页面的CSS属性。

有替代方案吗?某种CSS技巧我只能直接应用于div #footer的CSS?

希望听到您的建议,

3 个答案:

答案 0 :(得分:2)

你可以使用额外的div来帮助你模拟页脚的高度,当我像这样驱动我的固定标题时使用它:<div class="menu-top"></div>并把它放在我的标题的高度,在你的情况下我会用一个班级为footer-bottom的div,你可以放置一个70px的高度,测量你的页脚是这样的:

的CSS:

.footer-bottom{
    height: 70px;
}

HTML:

<div class="footer-bottom"></div>
<footer>
...
</footer>

这是一种简单但有效的方式,我希望它可以帮助你...

答案 1 :(得分:1)

简单的解决方案是添加&#39; margin-bottom&#39;到你的身体&#39;标签。这将解决您的问题。

答案 2 :(得分:1)

解决方案1:将您的常用css放入外部文件中,并将其包含在每个页面中。

解决方案2:PHP包括