fixed定位脱离文档流与float区别

作者: AG亚游集团 分类: 媒体专栏 发布时间: 2018-01-04

fixed定位脱离文档流

什么是脱离文档流?

简单说,就是将元素从普通的布局排版中拿走,别的块元素会当它不存在!拿走之后不影响其他快元素布局,不占空间。

position属性里有哪些是脱离文档流的?

absolute:会脱离文档流

fixed:会脱离文档流

relative:不会脱离文档流

与float浮动脱离文档流的区别?

使用float脱离文档流时,其他盒子会无视这个元素,但其他盒子内的文本依然会为这个元素让出位置,环绕在周围;

而对于使用absolute、fixed的position脱离文档流的元素,其他盒子内的文本都会无视它。

eg:

在做手机站的时候,往往页面下方会有拨打电话、联系客服等固定图标,随着浏览器窗口滚动一直会显示在最下方。如果这个时候,直接些fixed,会发现内容会被遮挡。

 

解决办法:

1、加一个空的div,给div设置高度。

2、给被遮挡的元素加下外边距。

加了之后显示效果:

本页标签: 定位



如果觉得本文对您有用,请您任意打赏。博主QQ/微信:468161447