- 使用空的<table>标签可以隔离父子元素的外边距，阻止外边距的重叠（直接添加会产生 无用标签，要在CSS中添加属性）
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 <style type="text/css"> 7 .box1{ 8 height: 300px; 9 width: 200px; 10 background-color: coral; 11 } 12 .box2{ 13 height: 200px; 14 width: 200px; 15 background-color: greenyellow; 16 margin-top: 30px; 17 } 18 .box1:before{ 19 content: ""; 20 display: table; 21 } 22 </style> 23 </head> 24 <body> 25 <div class="box1"> 26 <div class="box2"> 27 28 </div> 29 </div> 30 31 </body> 32 </html>