position:absolute
是会脱离文档流的,但是float呢?
float
之后还是会跟随父级,这是不是和position:absolute
到body或者html的脱离不是完全一样,
再或者说既然会跟随父级,那是不是就没有脱离?
position:absolute
是会脱离文档流的,但是float呢?
float
之后还是会跟随父级,这是不是和position:absolute
到body或者html的脱离不是完全一样,
再或者说既然会跟随父级,那是不是就没有脱离?
position:absolute
和float
都是使元素脱离文档流。
position:absolute
的元素是根据最近的非static
的父元素定位,如果没有,则根据最初的包含块定义(一般是body
),看MDN上的示例:https://developer.mozilla.org/samples/cssref/css-positioning.html
关于float
,也会脱离文档流,会被放置在其容器的左边或右边。
The float CSS property specifies that an element should be taken from the normal flow and placed along the left or right side of its container, where text and inline elements will wrap around it.
看MDN上的示例:https://developer.mozilla.org/samples/cssref/float.html
5 回答1.1k 阅读✓ 已解决
3 回答2.1k 阅读✓ 已解决
3 回答1.3k 阅读✓ 已解决
2 回答1.4k 阅读✓ 已解决
4 回答1.8k 阅读
3 回答1.3k 阅读✓ 已解决
2 回答1.8k 阅读✓ 已解决
两者都会使元素脱离文档流, 但是,与
absolute
不同的是:float
的元素还会在文档流上占据一个位置。看一个简单的实例你应该更容易理解:
DEMO:http://codepen.io/CodingMonkeyzh/pen/OVxGKL
从上面的效果中可以看出:
float
的元素,所以float
的元素在文档流还是占有有一席之位的。absolute
的元素遮挡了,说明absolute
的元素已经完全脱离文档流,文字可以无视它的存在。