我们在开发网站的时候一般都会分header、main、side、footer。这些模块分别包含了各自公用的信息,比如header一般都是本网站所有页面需要引入的模块,里面一般都是放置菜单等信息;而footer一般是放在网站所有页面的底部。当网页的内容比较多的时候,我们可以看到footer一般都是在页面的底部。但是,当页面的内容不足以填满一页的时候,你就会发现footer不是在浏览器窗口的底部。本文提供CSS方式使得网站可以始终固定在网页的底部。
我们的footer页面代码如下:
<footer class="footer"> <div class="container"> <p class="text-muted"><a href="" target="_blank">/</a> 版权所有,翻版不究</p> </div> </footer>
关键看下面的css代码:
.footer { position: absolute; bottom: 0; width: 100%; /* Set the fixed height of the footer here */ height: 60px; background-color: #f5f5f5; }
然后我们就可以使得footer模块一直在网站底端显示。很不错把,赶紧试试。
本博客文章除特别声明,全部都是原创!原创文章版权归过往记忆大数据(过往记忆)所有,未经许可不得转载。
本文链接: 【如何让网页的footer一直固定在底端】(https://www.iteblog.com/archives/1519.html)