任何人都可以创建一个带有粘性页脚的三行布局吗？内容必须一直填充到页脚，但如果内容大于页面，则页脚会被下推
有人可以创建这个或者有谁知道向您展示如何执行此操作的教程
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
html, body
{
min-height:100%; height:100%; margin:0px; width:100%
}
body > #wrapper
{
margin-bottom:-240px; height:100%
}
header
{
display:block; background-color:#ffd800; height:130px;
}
body > #wrapper > section
{
display:block; background-color:#ff6a00; height:100%; margin-bottom:-240px
}
footer
{
display:block; background-color:#ffd800; height:240px
}
</style>
<title></title>
</head>
<body>
<div id="wrapper">
<section>
<header>
Header
</header>
<div id="body">
<nav>
Left Sidebar
</nav>
<article>
<p>Content</p>
<p>Content</p>
<p>Content</p>
<p>Content</p>
<p>Content</p>
<p>Content</p>
<p>Content</p>
<p>Content</p>
<p>Content</p>
<p>Content</p>
<p>Content</p>
<p>Content</p>
<p>Content</p>
<p>Content</p>
<p>Content</p>
<p>Content</p>
<p>Content</p>
<p>Content</p>
</article>
<aside>
<p>Right Side Bar</p>
</aside>
</div>
</section>
</div>
<footer>
Footer
</footer>
</body>
</html>
最佳答案
这是广泛使用的粘性页脚。在 fiddle 中进行测试我创造了。
只需用 <h1>Hello</h1> 填充容器 div等进行测试，无论内容多少，都可以看到页脚粘在底部。
关于html - 三行布局内容 100% 高度带粘性页脚，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18862906/