本文探讨了HTML中通过使用浮动属性实现元素重叠的现象，并解释了如何通过浮动使两个不同大小的div元素不在同一平面上显示，而不影响其内部内容。
非完全脱离文档流
左右结构div盒子重叠现象，一般是由于相邻两个DIV一个使用浮动一个没有使用浮动。一个使用浮动一个没有导致DIV不是在同个“平面”上，但内容不会造成覆盖现象，只有DIV形成覆盖现象。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
*{
margin: 0;
}
.r1{
width: 100px;
height: 100px;
background-color: #7A77C8;
float: left;
}
.r2{
width: 200px;
height: 200px;
background-color: wheat;
}
</style>
</head>
<body>
<div class="r1"></div>
<div class="r2">region2</div>
</body>
</html>
两个DIV，一个脱离文档流，一个没有，导致DIV不在同一“平面”上，但内容上不会被覆盖的；
扫一扫
214
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
