Div+Css布局教程
正好自己以前寫過，奉上最簡短的代碼，效果已親測，兼容IE7/8以及Chrome等現代瀏覽器，代碼如下：
<!doctypehtml>
<html>
<head>
<metacharset="utf-8">
<title>div+css上中下布局</title>
<style>
html,body{height:100%;*overflow:hidden;/*消除IE7下的橫向滾動條*/}
body{margin:0;padding:0;font-size:30px;text-align:center;color:#fff;}
.top,.nav,.foot{width:100%;height:100px;position:absolute;}
.top{background:red;top:0;}
.nav{background:blue;top:100px;bottom:100px;height:auto;}
.foot{background:gray;bottom:0;}
</style>
</head>
<body>
<div>我是頭部</div>
<div>這里已經自適應到底部</div>
<div>我是底部</div>
</body>
</html>
注：IE6不支持，如想完美解決，請使用js動態獲取頁面高度，然后賦值給nav那個層。
css+div布局，左右兩個div怎么能自動適應高度
可以通過js實現兩個div自適應同等高度，如下：先設置div+css基本布局：
左邊
右邊
js實現div自適應高度代碼如下：div＋css布局是什么框架
div是框架，css是樣式，用來裝飾框架；詳細點來說，div就是給整個網頁布局，css就是負責控制div的樣式，想讓div在哪里怎么顯示，都可以通過css來實現。而div+css是一種網頁布局方法，是指通過css控制div的布局。
本教程操作環境：windows7系統、CSS3&&HTML5版、DellG3電腦。
div是框架，css是樣式，用來裝飾框架。JS讓它們動起來。再說詳細點，div就是給整個網頁布局，css就是負責控制div的樣式，想讓div在哪里怎么顯示，都可以通過css來實現，簡單的說網頁布局就像蓋房子，div負責把這棟房子蓋起來，而css負責告訴他怎么蓋！
而DIV+CSS是WEB設計標準，它是一種網頁的布局方法，是指通過css控制div的布局。其實這兒div可以理解為統稱，實際應用的不僅是div，還有p，span，img，table等任意節點的定位都可以通過css來控制。
divcss布局網頁如何實現網頁自動適應屏幕高度和寬度
html和body高度寬度設置為100%;在里面的塊級元素設置為百分比布局
div+css的布局較table布局有什么優點
div+css布局相對表格布局的優點:
1、符合W3C標準，結構、樣式和行為分離，代碼結構清晰明了，可維護性好；
2、布局精準，網站版面布局修改簡單；
3、頁面的加載速度快；
4、節省站點的空間、流量；
5、用只包含結構化內容的HTML代替嵌套的標簽，提高搜索引擎對網頁的搜索效率；
