[原创]关于absoluterelative和float的一些思考

Posted 2020-09-07 ┓天空之城┏

absolute：

　　元素完全脱离文档流，不占文档流的位置，不使用top、left等属性时，仍然在原文档流位置上（但是不在文档流中，也不占用位置），设置了top、left等之后，向上寻找到第一个非static元素作为父元素进行定位。

　　设置为absolute会令元素的display转变为inline-block，宽度不再是默认100%，而是实际占用，可以设置width：100%来改变。absolute元素由于脱离了文档流，在父元素的宽度计算中，不会计入。

relative：

　　元素脱离文档流，但是还占用文档流中的位置，根据原位置进行偏移。（top、left等也有效）

float：

　　同relative一样脱离文档流，也占用文档流的位置，与relative有所不同的是，它会影响正常文档流中的文字和inline元素，围绕在自身周围。display也会转变为inline-block。

 

参考：http://www.cnblogs.com/fu277/archive/2012/03/13/2393519.html