注意main的代码中margin:0 310 0 210 需在310以及210后加上px,变成margin:0 310px 0 210px才会产生10px的边框以及自适应文字不会覆盖掉文字
.top{width:100%;height:200px;background:#ccc;}
.main{width:100%;height:600px;background:red;}
.left{width:200px;height:600px;background:#00f;position:absolute;left:0;top:200px;}
.right{height:600px;background:#9f9;margin-left:210px;}
.foot{width:100%;height:150px;background:#f60;}
.main{width:100%;height:600px;background:red;}
.left{width:200px;height:600px;background:#00f;position:absolute;left:0;top:200px;}
.right{height:600px;background:#9f9;margin-left:210px;}
.foot{width:100%;height:150px;background:#f60;}
最新回答 / 慕神2768241
你的父元素main没加高度?如果不想添加高度,那么让foot清除浮动( clear:both; )也可以,至于为什么要清除浮动,自己上网查查,因为我也是个初学者。。。
2018-05-02
最赞回答 / 枫芒i
footer 的色块已经跑到了上面,只有文字在下面,之所以会跑走,是因为上面的元素用了浮动,原来的位置就空了出来,然后 footer 没有浮动元素,又没有清除浮动,就占据了中间位置,所以,想让footer 在他自己的位置,就先清除浮动(clear:both)希望帮到你~....footer{ height:50px; background:#9F9; clear:both;}
2018-05-02