HTML:layout footer

footer.html

<header> HTML
<h1>Site name</h1>
</header>
<main>
<p>Bacon Ipsum dolor sit amet...
<!-- 从baconipsum.com那里复制一些示意文字过来 --></p>
</main>
<footer>
<p>© 2015 No rights reserved.</p>
<p>Made with ♥ by an anonymous pastafarian.</p>
</footer>

<style>
body {
display: flex;
/*不指定为列显示，则会水平排布显示*/
flex-flow: column;
min-height: 100vh;
}
/*内容区块的高度自动伸展并占满所有空间*/
main { flex: 1; }
</style>