<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> .div1{ width: 300px; height: 300px; background: red; /* div1距离下边5个px margin-bottom 外边距一般用在兄弟关系(即双方是平级关系,不存在包含关系),设置兄弟和兄弟之间的距离 * */ /*margin-bottom:5px ;*/ } .div2{ width: 300px; height: 300px; background: blue; margin-top: 20px; margin-left: 20px; margin-right: 20px; } </style> </head> <!-- 外边距 --> <body> <div class="div1"></div> <div class="div2"></div> </body> </html>
演示效果:
