粘性页脚
展示了 3 种制作粘性页脚的方法。 每个 HTML 文件都与其他文件相同,但 CSS 类的命名空间不同。
项目设置
安装 Node.js
为lol.stickyfooter.com创建主机文件条目。
在项目的根目录中运行npm start 。
什么是粘性页脚?
在 Web 开发中您可能会遇到的一件事是,即使内容的高度没有垂直填充窗口,也必须将页脚放在窗口的底部。
如果内容超出窗口底部,则页脚将位于页面末尾。 另一方面,当您有少量内容时,页脚将位于内容正下方,在它和窗口底部之间留下一堆空白。
有几种方法可以解决这个问题,但在大多数设计中,页脚应该位于窗口底部,或者如果内容比窗口长,则它应该位于页面底部。
方法
弹性盒 (CSS)
绝对定位 (CSS)
jQuery (JS)
弹性盒 (CSS)
优点
非常简单和干净的 CSS
允许可变高度的页脚
没有无样式内容的闪光
1