<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>footer需要固定在底部</title>
<style type="text/css">
html,body{font-size: 14px;font-family: "微軟雅黑";text-align: center;width: 100%;height: 100%; min-height: 100%;border:0;line-height: none;}
body{padding:0px; margin:0px ;}
.container{position:relative;height: auto;min-height: 100%;margin: 0}
.container .header{height: 100px;background: #0000FF;}
.container .push{padding-bottom: 100px;}
.footer{position:relative;height: 100px;margin-top:-100px;background: #0000FF;}
</style>
</head>
<body>
<div class="container">
<div class="header">
</div>
<div class="content">
</div>
<div class="push"></div><!--push在此爲footer佔位，高度和footer的一樣-->
</div>
<div class="footer">
<p>底部文本</p>
</div>
</body>
</html>
HTML中footer固定在頁面底部的若干種方法
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章