关于圣杯布局中的浮动问题

我想问一下，3-2视频中只给header和footer设置了浮动，为什么显示效果不是header和footer紧挨着。

浮动不是脱离文档流了么，为什么中间container的内容不会被覆盖掉？

叫我蛋蛋 2018-04-24

源自：CSS网页布局基础 3-2 圣杯布局案例

28

收起

2回答

正在想名字呢回答被采纳获得+3积分 2018-04-24 18:53:38

这里footer设置了浮动，脱离了文档流，但是中间的container的内容没有设置浮动，就是没有脱离文档流，因此container的高度是存在的，按照文档执行顺序，footer被container撑在了下面。

叫我蛋蛋提问者 #1

那header呢？为什么不被container所覆盖？

2018-04-24 18:55:29
樱桃小胖子回复提问者叫我蛋蛋 #2

header虽然设置了浮动，但是设置了固定的高度，因此高度没有塌陷，所以不会覆盖，祝学习愉快！

2018-04-24 19:08:41
叫我蛋蛋提问者 #3

非常感谢！

2018-04-24 19:31:06

奥义憨憨 2018-04-24 16:38:10

同有疑问，同学，知道答案了告诉我一下哈

相似问题

圣杯布局float问题

圣杯布局，左边宽度必须大于右边吗，如果左边宽度小于右边宽度，2X+Y还成立吗

圣杯布局中的float和margin-left

关于圣杯布局和双飞翼布局如何让页面两边留白

关于圣杯布局

登录后可查看更多问答，登录/注册

前端小白入门系列课程

参与学习人
提交作业 11218 份
解答问题 36712 个

从一个不会编程的小白到一个老司机是需要过程的，首先得入门，学习基础知识，然后才能进阶，最后再到精通，本专题是你走进前端世界的不二选择！

本课精华内容

问答作业

为什么我的没有框

5 45

表格的问题

377 41

大家好,body前面有一个红色的小××，麻烦大家帮我看看

378 40

到底是cellspacing还是cellpacing?

0 35

课间活动的表格怎么实现，想了很久也想不出来

60 30

查看更多本课问答

请稍等 ...

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

扫描二维码
关注慕课网微信公众号