float能实现文本环绕效果是因为，元素浮动后，宽度实体依旧存在，且与文字处于同一文档流中，文字不会与浮动元素位置重叠，那为何浮动元素后跟的是个块级元素时，它们就会重叠呢
2 回答
已采纳
qq_安安_17
TA贡献49条经验 获得超52个赞
你好，首先文字是否环绕与元素是块级元素还是行内元素无关，如下
span为行内元素，可以环绕
p为块级元素，也可以环绕
你所说的重叠应该是这种情况
<style type="text/css">
.box1{
width:300px ;
height: 300px;
background-color: pink;
float: left;
}
.box2{
width:300px ;
height: 300px;
background-color: blue;
}
</style>
</head>
<body>
<div class="box1">box1 </div>
<div class="box2">box2</div>
</body>由于box1左浮动，把box2背景区域遮挡
是因为：box1左浮动，相当于飘在页面，没有占据位置，box2就显示在页面最开始的地方，想显示可以清除浮动。
但是，请注意：box2在块级元素的文字没有发生重叠，而是环绕到box1的周围
为确保box2的文字与box1分开，因此显示到box1周围
浮动最初的目的：将浮动元素从文档的正常流中删除，使其他元素忽略他的位置。就是为了实现文字环绕浮动元素的功能
希望可以帮到你
点击展开后面1条
橋本奈奈未
TA贡献436条经验 获得超108个赞
float CSS属性指定一个元素应沿其容器的左侧或右侧放置，文本和内联元素将围绕它。
然后，该元素被从网页的正常流动中移除，尽管仍然保持部分的流动性（与绝对定位相反）。
建议观看站内的深入理解之float浮动教程。
- 2 回答
- 0 关注
- 1853 浏览
相关问题推荐
添加回答
举报
0/150
提交
取消