设置浮动之后为什么div上的字还留在原来的位置
来源：4-4 浮动
sx1011
2020-09-01 22:35:24
<!DOCTYPE html>
<html>
<head>
<title>Document</title>
<!-- <link rel="stylesheet" type="text/css" href="index.css"> -->
<style type="text/css">
div{
width:200px;
height:200px;
}
#div1{
background-color:yellow;
float:right;
}
#div2{
background-color:red;
width:300px;
float:left;
}
#div3{
background-color:blue;
}
</style>
</head>
<body>
<div id="div1">第一个</div>
<div id="div2">第二个</div>
<div id="div3">第三个</div>
</body>
</html>
写回答
1回答
-
同学你好，因为浮动脱离了文档流，但是没有脱离文本流，文字属于文本流
div3有浮动效果之后是会脱离文档流，但是"第三个"文字属于文本流，并不是文档流，所以并不会覆盖文字。
注：文档流与文本流
文档流：指的是元素在HTML中的位置顺序决定排布的过程，主要的形式是自上而下（块级元素）一行接一行，每一行从左至右（行内元素）。主要是针对盒子模型来说的
文本流：文本流是指html文本的显示，相对于文字段落来说。
如果我的回答解决了你的疑惑，请采纳！祝学习愉快！
0
相似问题