页脚是在页面末尾组织大量网站导航和信息的好方法。当用户完成当前页面的滚动或正在寻找有关您网站的其他信息时，他们会在这里查看。
介绍
注意: 我们是使用flexbox结构来组织html。 页脚总是在页面的底端。 这三个HTML5标签: <header>, <main>, <footer>用来保证页面的结构是非常重要的。
<footer class="page-footer">
<div class="container">
<div class="row">
<div class="col l6 s12">
<h5 class="white-text">脚本内容</h5>
<p class="grey-text text-lighten-4">您可以在此处使用行和列来组织页脚内容。</p>
</div>
<div class="col l4 offset-l2 s12">
<h5 class="white-text">链接</h5>
<ul>
<li><a class="grey-text text-lighten-3" href="#!">链接 1</a></li>
<li><a class="grey-text text-lighten-3" href="#!">链接 2</a></li>
<li><a class="grey-text text-lighten-3" href="#!">链接 3</a></li>
<li><a class="grey-text text-lighten-3" href="#!">链接 4</a></li>
</ul>
</div>
</div>
</div>
<div class="footer-copyright">
<div class="container">
© 2014 Copyright Text
<a class="grey-text text-lighten-4 right" href="#!">更多链接</a>
</div>
</div>
</footer>
粘性页脚
无论页面上的内容有多少，粘性页脚总是停留在页面底部。但是，如果有很多内容，这个页脚会被向下推，所以它与固定的页脚不同。将以下代码添加到您的CSS文件中。
注意：这可能会导致在IE浏览器出现问题，因为它对flexbox的支持较弱。
body {
display: flex;
min-height: 100vh;
flex-direction: column;
}
main {
flex: 1 0 auto;
}