CSS样式-外边距的合并

当两个盒子都设置margin的时候，两个盒子的真实距离，是两个盒子的margin中最大的那个，而不是两个盒子的margin之和;

不要给两个盒子同时设定margin，把margin的值设定到一个盒子上；要不只设置div1的margin-bottom，要不只设置div2的margin-top

<head>

　　<style type="text/css">

　　　　div {

　　　　　　width:200px;

　　　　　　height:200px;

　　　　　　background-color:#f00;

　　　　}

　　　　#div1 {

　　　　　　margin-bottom: 100px;

　　　　}

　　　　#div2 {

　　　　　　margin-top: 150px;

　　　　}

　　</style>

</head>

<body>

　　<div id="div1"></div>

　　<div id="div2"></div>

</body>

=========两个盒子之间的距离是150px==========

posted @ 2021-02-24 23:38  #Friday  阅读(62)  评论(0)    收藏  举报