为什么box2设置清除左浮动后box3也跟着box2下来了？
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
html,body{
margin: 0;
}
div{
height: 200px;
width: 200px;
border:2px solid red;
margin: 4px;
float: left;
}
#box2{
clear: left;
}</style>
</head>
<body>
<div id="box1">第一个盒子</div>
<div id="box2">第二个盒子</div>
<div id="box3">第三个盒子</div>
</body>
</html>
还有就是如果box2设置清除右浮动为什么三个盒子会依然显示在一行？
高为砚浏览 1148回答 1
1回答
-
甜玉米和咸玉米
因为清除浮动是针对自身之前的元素，给box2设置了清除左浮动实际上就是清除了box1的浮动带来的副作用，那么box2及其后面的元素都会换行。同样的道理，box2清除右浮动，然而box2前面的元素并没有右浮动，当然3个盒子还是会显示在一行里啦。
随时随地看视频慕课网APP
Html/CSS