如何理解浮动？
1、只设置div1为左浮动，为什么div2的内容在原来的位置，而div2的边框却不见了
2、只设置div1为左浮动，结果如图：
个回答
-
- 慕函数5139925
- 2020-10-04 16:09:13
<div style="clear:both;"></div>
-
- Maoli_
- 2019-11-25 20:33:45
浮动浮动顾名思义就是浮动在了正常的流上，当内联元素遇到浮动元素时就会环绕着他，所以那个文字就卡在了浮动元素边界下方
-
- 蝴蝶蓝兰
- 2019-10-05 12:19:02
被覆盖了
-
- carol_PHP
- 2019-09-24 23:40:51
为什么设置栏目1向右浮动时则直接向右偏移，而栏目2（包括文字）占据原先栏目1的位置？
因为#div1{float:right} 会使栏目1脱离文档流并且向右移动;
这时由于浮动框(栏目1)不在文档的普通流中，所以文档的普通流中的块框(栏目2)表现得就像浮动框(栏目1)不存在一样。
因此栏目2（包括文字）会占据原先栏目1的位置.
_____________________________________________________________________________________________
为什么#div1{float:left} 时, 栏目2 的文字会环绕在栏目1下面.这个我也不清楚 = =
希望大佬们可以解惑!
________________________________________________________________________________________________
不好意思我也是小白,理解的不知道对不对.
主要参考了W3的CSS 浮动 章节.
-
- carol_PHP
- 2019-09-24 15:47:02
按你写的#div1{float:left} 这个时候：
当框 1 向左浮动时，它脱离文档流并且向左移动，直到它的左边缘碰到包含框的左边缘。
因为它不再处于文档流中，所以它不占据空间，实际上覆盖住了框 2，使框 2 从视图中消失。
再理解一下float的含义：
浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。
由于浮动框不在文档的普通流中，所以文档的普通流中的块框表现得就像浮动框不存在一样。