问:
块级元素设置浮动后将从标准流中脱离出来吗
答:
是的,当一个块级元素设置浮动(float)属性后,它将从标准文档流中脱离出来。
具体来说:
1. 浮动元素会向左或向右浮动,与其他元素的位置关系依赖于浮动方向。非浮动元素的定位不会考虑浮动元素的存在。
2. 浮动元素不会影响块级容器的高度,容器的高度会缩回到只包含非浮动元素的高度。这可能会导致未清除浮动的下层元素环绕在浮动元素周围的情况。
3. 相邻的浮动元素会并排 float,直到它们的宽度之和超过包含块的宽度,这时它们会另起一行排列。
4. 浮动元素会创建一个新的浮动环境(BFC),该环境内的元素会忽略外部浮动元素的影响。
5. 浮动元素会触发包含块的格式化上下文重新布局。
6. 浮动元素依然是块级元素,会独占一行,但不会 forcing line break 产生空白段落。
7. 浮动元素可以使用 clear 属性来清除浮动,使元素回到标准文档流。clear 属性取值 none(默认)、left、right、both,用来清除左侧/右侧/左右两侧浮动元素的影响。
综上,浮动元素虽然从标准文档流中脱离,但它仍然会影响周围元素的布局,需要很好地理解浮动 和 清除浮动来制作网页布局。