腳本代碼(For Alixixi.com)如下:

div層仿網(wǎng)頁框架布局特效代碼 - by 阿里西西 js.alixixi.com

* { margin:0; padding:0; list-style:none;}

html { height:100%; overflow:hidden; background:#fff;}

body { height:100%; overflow:hidden; background:#fff;}

div { background:#f60; line-height:1.6;}

.top { position:absolute; left:10px; top:10px; right:10px; height:50px;}

.side { position:absolute; left:10px; top:70px; bottom:70px; width:200px; overflow:auto;}

.main { position:absolute; left:220px; top:70px; bottom:70px; right:10px; overflow:auto;}

.bottom { position:absolute; left:10px; bottom:10px; right:10px; height:50px;}

/*---ie6---*/

html { _padding:70px 10px;}

.top { _height:50px; _margin-top:-60px; _margin-bottom:10px; _position:relative; _top:0; _right:0; _bottom:0; _left:0;}

.side { _height:100%; _float:left; _width:200px; _position:relative; _top:0; _right:0; _bottom:0; _left:0;}

.main { _height:100%; _margin-left:207px; _position:relative; _top:0; _right:0; _bottom:0; _left:0;}

.bottom { _height:50px; _margin-top:10px; _position:relative; _top:0; _right:0; _bottom:0; _left:0;}

阿里西西 網(wǎng)頁特效演示中心

DEMO BY JS.ALIXIXI.COM

一個標準的，兼容性很好的div仿框架的基礎模型！

總結

以上是生活随笔為你收集整理的html网页div框架代码,div层仿网页框架布局特效代码的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內容還不錯，歡迎將生活随笔推薦給好友。