右边区块没有固定,会变小
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
*{padding:0; margin:0;}
body{min-width:700px;}
.head,.footer{
width:100%;
height:40px;
float:left;
line-height:40px;
text-align:center;
background:#e4e4e4;
}
.body{
padding:0px 220px 0px 200px;
}
.middle{
width:100%;
background:blue;
}
.left{
width:200px;
background:green;
margin-left:-100%;
left:-200px;
}
.right{
width:220px;
background:red;
margin-left:-220px;
right:-220px;
}
.left,.middle,.right{
float:left;
position:relative;
min-height:300px;
}
</style>
</head>
<body>
<div class="head">
<p>我是头</p>
</div>
<div class="body">
<div class="middle">
<p>我是内容的中间</p>
</div>
<div class="left">
<p>我是内容的左边</p>
</div>
<div class="right">
<p>我是内容的右边</p>
</div>
</div>
<div class="footer">
<p>我是尾巴</p>
</div>
</body>
</html>
正在回答
所说情况,当缩小到一定程度,在继续缩小红色区变小并在网页内不可见吧!
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36713 个
从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星