abstract：<!DOCTYPE html> <html> <head> <title>CSS中的浮動(dòng)</title> <meta charset="utf-8"> <style type="text/css"> *{margin: 0px;
<!DOCTYPE html>
<html>
<head>
<title>CSS中的浮動(dòng)</title>
<meta charset="utf-8">
<style type="text/css">
*{margin: 0px;padding: 0px;}
.clear{clear: both;}
.box1{height: 100px;width: 100px;border: 2px solid red;float: left;}
.box2{height: 100px;width: 100px;border: 2px solid red;float: left;}
.box3{height: 100px;width: 100px;border: 2px solid red;float: left;}
.box4{height: 100px;width: 100px;border: 2px solid red;float: left;}
.box5{height: 300px;width: 1500px;border: 2px solid red;}
</style>
</head>
<body>
<div class="box1"></div>
<div class="box2"></div>
<div class="box3"></div>
<div class="clear"></div>
<div class="box5"></div>
</body>
</html>
Correcting teacher：天蓬老師Correction time：2019-01-13 09:23:04
Teacher's summary：<div class="clear"></div>, 添加新元素的方式來(lái)清除浮動(dòng),并不是一個(gè)好的解決方案, 第一,會(huì)增加一個(gè)頁(yè)面元素,增加了頁(yè)面渲染的負(fù)擔(dān),第二個(gè)生成的dom文檔樹中有一個(gè)無(wú)內(nèi)容的元素, 這對(duì)于php等后端語(yǔ)言來(lái)渲染前端頁(yè)面時(shí), 造成一定的困擾