<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
*{margin:0;padding: 0;}
body{min-width: 700px;}
.top,.bottom{
width: 100%;
height: 50px;
line-height: 40px;
background-color: #539D26;
margin: 0 auto;
float: left;
}
.zhong{
padding: 0 200px 0 200px;
}
.z,.left,.right{
position: relative;
float: left;
min-height: 300px;
}
.z{
background-color: #999999;
width: 100%;
}
.left{
width: 200px;
background-color: #00FFFF;
margin-left: -100%;
left: -200px;
}
.right{
width: 200px;
background-color: #00FF00;
margin-right: -200px;
}
</style>
</head>
<body>
<div class="top">头部</div>
<div class="zhong">
<div class="z">zhonga<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
v<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br />asdasdasd
</div>
<div class="left">zuo</div>
<div class="right">you</div>
</div>
<div class="bottom">尾部</div>
</body>
</html>上面是代码，打开后可以看到只有中间部分延长了，两侧不会跟着延长，我试过给左中右三个div设置height：100%，但是没用，如果要实现左中右三列延长的时候还能同步，要怎么设置？谢谢！
2 回答
- 2 回答
- 0 关注
- 2075 浏览
相关问题推荐
添加回答
举报
0/150
提交
取消