我试图达到粘性页脚所做的相同效果,但是我遇到的问题不会出现在任何教程或问题中:我的页脚的高度也是动态的。
我的页脚中有一些新闻项,因此页脚的高度会根据这些新闻项的长度而变化。 显然,当内容的高度小于浏览器的视口时,我希望页脚位于页面底部的绝对位置,当内容的高度高于实际的视口时,我希望页脚位于页面底部。
目前我在jQuery中成功实现了这个,但是我想要一个仅限CSS的方法(如果有的话),因为有些用户在他们的浏览器中禁用了JavaScript。
非常感谢!
修改
我的代码非常常见:我的<header>
标记中有<aside>
,<section>
,<footer>
和<body>
。
在jQuery中,我几乎将这些元素(没有页脚)的高度总和与浏览器视口相比较。如果值更大,我会在页脚中添加position:relative
,否则我会向其添加position:absolute; bottom:0
。
答案 0 :(得分:1)
CSS可以通过使用bottom:0; position:fixed;
来完成其中一些操作但IE6和7可能不支持。我建议将CSS方法与jQuery解决方案结合使用,以便所有用户都有类似的体验。