CSS浮动流脱标的字围现象

浮动流脱标的字围现象不仅针对文字, 这种现象也会把行内和行内块当做文字.

浮动流的脱标与定位流的脱标不一样:

定位流的脱标对后续元素的影响可以直接无视它的存在, 而浮动流的脱标有字围现象,所以不能直接无视浮动元素的存在

1.浮动流对后续标准流中的行内块级, 以及行内元素的影响:

行内块级and行内元素 视为文本, 浮动流并不会遮挡文本(而脱标的定位流会遮挡文本), 它们会沿着定位流的同一行,接着往后排.

2.浮动流对后续标准流中的块级元素的影响:

块级元素上浮, 被浮动流遮挡一部分,但块级元素中的文本(包括块级元素内部的行内块,以及行内-)并不会被遮挡, 是从浮动元素的边界之外开始写.

 

补充:
浮动流的脱标会遮挡标准流

而脱标的定位流不仅遮挡标准流, 甚至会遮挡浮动流.