css將div固定在網頁底部程式碼例項

antzone發表於2017-03-08
CSS網頁

在實際佈局中，可能需要將一個div固定於網頁的底部，不管出於什麼樣的需要，反正有這樣的需求，下面就通過程式碼例項介紹一下如何實現此效果，程式碼如下:

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html> 
<html> 
<head> 
<meta charset=" utf-8"> 
<meta name="author" content="http://www.softwhy.com/" /> 
<title>table細線表格-螞蟻部落</title> 
<style type="text/css">  
body{
  margin:0px;
  padding:0px;
  height:1000px;
}
#thediv{
  height:30px;
  width:100%;
  background:green;
  position:fixed;
  bottom:0px;
}
</style>  
</head>  
<body>  
<div id="thediv"></div>
</body>  
</html>

以上程式碼中，實現了我們的要求，IE6瀏覽器不支援此效果，不過現在應該可以不用考慮IE6了。

相關文章