返回首页当前位置:首页 >> 网站建设 >> 正文

CSS布局中自适应高度的解决方法

文章来自:设计学院 | 发表时间:2007-10-14 19:47:22

这是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;

}