平面设计网页设计-CSS布局中自适应高度的解决方法爱心论坛 - 自强爱心网

以文本方式查看主题

-  爱心论坛  (http://zqax.net/bbs/index.asp)
--  平面设计网页设计  (http://zqax.net/bbs/list.asp?boardid=43)
----  CSS布局中自适应高度的解决方法  (http://zqax.net/bbs/dispbbs.asp?boardid=43&id=29793)

--  作者：小猴乖乖
--  发布时间：2007/10/12 8:58:05
--  CSS布局中自适应高度的解决方法

这是div+css布局中经常会碰到的基础问题，个人觉得采用背景图填充的方法，还是比较简单和切实可行的。最终效果。
CSS源代码:以下是引用片段：
body{
background:#EDEDED;
font-size:70%;
font-family:Arial,Helvetica,sans-serif;
line-height:130%;
color:#666666;
margin:0;
padding:0;
text-align:center;
}
#layout{
width:760px;/*--forie5.x--*/
w\\idth:740px;/*--other--*/
margin:10pxauto;
border:solid10px#999999;
border-bottom:solid9px#999999;
/*--底部要加个1px的DIV来清除浮动，所以把
底边框设为9px--*/
background:url(bg.gif)#FFFFFFrepeat-yleft;
/*--背景填充，解决左右栏高度不一致--*/
text-align:left;
}
#sidel{
float:left;
width:190px;
}
#sider{
float:right;
width:540px;
}
pre{
padding:10px;
margin:0;
}
.clear{
background:#999999;
clear:both;
height:1px;
overflow:hidden;
}