日期:2014-05-17  浏览次数:20619 次

DIV+CSS布局
《DIV+CSS布局》3个DIV...

最终想要得到的结果是:

1.最上方DIV固定在窗口可见区域的最上方,基本Style="width:100%; height:160px; padding:10px 20px; border:1px solid #95caca; background:#d1e9e9;"

2.最下方DIV固定在窗口可见区域的最下方,基本Style="width:100%; height:60px; padding:10px 20px; border:1px solid #95caca; background:#d1e9e9;"

3.中间DIV固定在上下两个DIV中间,宽度为60%,边框为1px; 高度等于窗口可见区域的总高度减去上下两个DIV高度

怎么实现,大侠帮忙。。。


------解决方案--------------------
上下2个DIV都用position:fixed;
中间的DIV,用position:absolute;left:0;top:160px;

jqeury控制高度

JScript code

$(document).ready(function(){
   var height = $window.height();
   $('#middle').css('height',height-160-60+'px');
});
$(window).resize(function() {
   var height = $window.height();
   $('#middle').css('height',height-160-60+'px');
});