老师,您好!浮动脱离文档流是一种怎样的脱离?

老师,您好!浮动脱离文档流是一种怎样的脱离?

我发现在本节课程中,对div3设置浮动时,其不管往左还是往右,其范围都在父元素div1的宽度范围内。当div3设置浮动时,不是脱离文档流了吗?这个是什么原因?

正在回答

登陆购买课程后可参与讨论,去登陆

3回答

同学你好,当子元素浮动时,父元素设置固定宽度,则子元素的宽度并不会对父元素的宽度产生影响。并且父元素的宽度会限制子元素。当子元素的宽度超过父元素的宽度时,子元素会被挤下去。

如果我的回答解决了你的疑惑,请采纳!祝学习愉快!

好帮手慕小尤 2020-06-16 14:07:08

同学你好,当父元素设置固定的宽度。并将子元素进行浮动,会根据设置的父元素的宽度进行设置。如果当浮动的子元素的宽度超过父元素的宽度,子元素会被挤下去。如下图所示:

http://img1.sycdn.imooc.com//climg/5ee86183094b40ee07560443.jpg

如果我的回答解决了你的疑惑,请采纳!祝学习愉快!

  • 提问者 mahsiaoko #1
    子元素浮动不是已经脱离文档流了吗?为什么还会受到父元素宽度限制?
    2020-06-16 14:26:24
好帮手慕小尤 2020-06-16 11:10:36

同学你好,当将div3设置为浮点时,会脱离文档流。如下所示:其范围并没有在父元素div1的宽度范围内。

http://img1.sycdn.imooc.com//climg/5ee837c70990998010870445.jpg

http://img1.sycdn.imooc.com//climg/5ee8381e09f1a42906390663.jpg

如果同学在测试时,出现不同的效果,则建议同学反馈相关代码,便于老师进行测试。

如果我的回答解决了你的疑惑,请采纳!祝学习愉快!

  • 提问者 mahsiaoko #1
    是这样的,我发现假如div1的width是500px,那么如果div2和div3的width之和超过了500,浮动之后没法在一行显示
    2020-06-16 12:57:50
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师