                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /如何用CSS进行网页布局

foot被覆盖

为什么foot被覆盖

body{ margin:0; padding:0; font-size:30px; color:#fff}

.top{height:100px;top:0;background:#999;}

.main{width:100%;height:400px;background:red;position:absolute;}

.left{ width:200px;height:400px;position:absolute;left:0;top:0; background:blue;}

.right{height:400px;margin:0 0 0 210px;background:green;}

.foot{height:80px;background:orange;clear:both;}

</style>

如果不在foot里面加上margin-top：400px；foot就会出现在top贴在top下面被main覆盖；但是foot的margin-top不应该是与main盒子边距吗？觉得应该是0才对啊，但是为什么会是与top盒子的边距呢。top又不是foot的父类，求大神教

慕粉4309759

2017-02-18

源自：如何用CSS进行网页布局 5-3

关注问题我要回答

871

操作

收起

3 回答

Adele_D 回答被采纳 +3 积分
2017-02-18

为什么要绝对定位、、、

.main{width:100%;height:400px;background:red;}

0 回复有任何疑惑可以回复我~

收起回答

慕粉4309759 提问者

非常感谢！

2017-02-26 回复有任何疑惑可以回复我~

EricZoo
2017-02-22

.top{background:#ccc;height:100px;}

.main{height:600px;background:red;}

.left{width:200px; height:600px;background:blue;}

.right{height:600px;background:yellow;left:210px;width:100%;position:absolute;}

.foot{background:orange;height:50px;}

不用那么多属性啊，就定位个right，其他的原属性就ok了啊，我之前也relative和absolute一起用，结果删减发现，并没有什么决定性作用，就上面的代码就能实现了，

0 回复有任何疑惑可以回复我~

收起回答

慕粉4309759 提问者

谢谢谢谢

2017-02-26 回复有任何疑惑可以回复我~

皛芃
2017-02-18

你main中应该采用relative绝对定位才行的,这样foot才会以mian的底部作为起始

2 回复有任何疑惑可以回复我~

收起回答

慕粉4309759 提问者

谢谢谢谢

2017-02-26 回复有任何疑惑可以回复我~

0/150

提交

取消

如何用CSS进行网页布局

参与学习 209624 人
解答问题 1153 个

用最简洁的案例教你布局的那些知识，这是前端工程师基本技能

进入课程

foot被覆盖

我要回答关注问题

热搜

最近搜索清空

foot被覆盖

3 回答

foot被覆盖