相对定位的元素也不会离开文本流吗?

相对定位的元素也不会离开文本流吗?

浮动的元素没有脱离文本流,那么再设置position,是相对于它在文本流中的位置进行定位的吗?

正在回答

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

1回答

同学你好,元素设置了float的值为left或right,这个元素就脱离了文档流。

如果继续为这个元素设置相对定位即position:relative; 会使这个元素相对于该元素目前所在的位置进行定位,并且该元素目前所占的空间还保留在页面中。 示例:

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

上面这段代码,三个div盒子都设置了左浮动, 脱离了文档流, 第二个盒子设置了相对定位, 第三个盒子并没有向左移动。说明第二个盒子是相对自身发生了移动。效果图如下:

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

同学可以结合上面的实例,自己下去练习一下, 如果还有什么不理解的地方,可以继续在问答区提问,我们会给你提供合适的解决方案的

如果帮助到了你, 欢迎采纳

祝学习愉快~~~

  • 慕函数3762822 提问者 #1
    想确认下,文档流和文本流应该是不一样的,浮动元素脱离的是文档流,但还在文本流?
    2019-03-26 23:20:49
  • 好帮手慕慕子 回复 提问者 慕函数3762822 #2
    文档流和文本流是有区别的。 文档流是相对于盒子模型讲的,文本流是相对于文字段落讲的。 浮动元素脱离的是文档流,也就是说当它后面还有元素时,这些元素会无视浮动元素所占据了的区域,直接在它身下布局。但是文字元素却会认同浮动元素所占据的区域,围绕它布局,也就是没有拖出文本流。
    2019-03-27 09:25:45
问题已解决,确定采纳
还有疑问,暂不采纳

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

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

0 星
前端小白入门系列课程
  • 参与学习           人
  • 提交作业       11218    份
  • 解答问题       36713    个

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

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

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