html FOOTER FIXE
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了html FOOTER FIXE相关的知识,希望对你有一定的参考价值。
<div id="container">
<div id="header"></div>
<div id="body"></div>
<div id="footer"></div>
</div>
html,
body {
margin:0;
padding:0;
height:100%;
}
#container {
min-height:100%;
position:relative;
}
#header {
background:#ff0;
padding:10px;
}
#body {
padding:10px;
padding-bottom:60px; /* Height of the footer */
}
#footer {
position:absolute;
bottom:0;
width:100%;
height:60px; /* Height of the footer */
background:#6cf;
}
solution habituelle mais qui ne gère pas les petits contenants
<!DOCTYPE html>
<html>
<head>
<style>
.footer {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
background-color: red;
color: white;
text-align: center;
}
</style>
</head>
<body>
<h2>Fixed/Sticky Footer Example</h2>
<p>The footer is placed at the bottom of the page.</p>
<div class="footer">
<p>Footer</p>
</div>
</body>
</html>
以上是关于html FOOTER FIXE的主要内容,如果未能解决你的问题,请参考以下文章
ios 底部用定位 fixed。在软件盘出来后,页面元素被顶上去一部分,fixed定位的footer也跑到了上面去。解决方法
Html - Footer
css Sticky footer html5(http://ryanfait.com/html5-sticky-footer/)
html sticky.footer.html
html il tag footer.html
html footer.php.html