html+css float浮动问题：红色div为何会挤走第一行文字
代码如下：<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xh...
代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<body>
这是第一行这是第一行这是第一行这是第一行这是第一行这是第一行
<div style="background-color:red; height:100px; width:100px; margin-top:0px; float:left"></div>
这是第三行这是第三行这是第三行这是第三行这是第三行这是第三行这是第三行
</body>
</html>
ps：我知道是float的问题，我想知道，为何float会挤走第一行文字。 展开
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<body>
这是第一行这是第一行这是第一行这是第一行这是第一行这是第一行
<div style="background-color:red; height:100px; width:100px; margin-top:0px; float:left"></div>
这是第三行这是第三行这是第三行这是第三行这是第三行这是第三行这是第三行
</body>
</html>
ps：我知道是float的问题，我想知道，为何float会挤走第一行文字。 展开
2个回答
展开全部
HTML页面的标准文档流(默认布局)是：从上到下，从左到右，遇块(块级元素)换行。给元素的float属性赋值后，就是脱离文档流，进行左右浮动，紧贴着父元素(默认为body文本区域)的左右边框。而此浮动元素在文档流空出的位置，由后续的(非浮动)元素填充上去：块级元素直接填充上去，若跟浮动元素的范围发生重叠，浮动元素覆盖块级元素。内联元素：有空隙就插入。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
