🌶️第3期第6题：float:left对比position:absolute

[LinDaiDai]

float:left对比position:absolute

相同点：

• 脱离文档流，也就是将元素从普通的布局排版中拿走，其他盒子在定位的时候，会当做脱离文档流的元素不存在而进行定位。
• 包裹性：也就是都会让元素inline-block化。等同于没有高度与宽度的inline-block元素。
  • 对于块状元素默认的宽度为100%，若设置为了绝对定位则宽度由内容决定
  • 对于内联元素原本设置width属性无效，若设置了浮动则可以设置width值
• 破坏性：都会导致父级高度塌陷。但若是设置了绝对定位的话，其父级即使设置为float:left;也还是不能解决高度塌陷的问题。

不同点：

• 虽然它们都会脱离文档流，但是使用float脱离文档流时，其他盒子会无视这个元素，但其他盒子内的文本依然会为这个元素让出位置，环绕在周围。而对于使用position:absolute脱离文档流的元素，其他盒子与其他盒子内的文本都会无视它。