1. 程式人生 > >塊狀元素垂直外邊距重疊

塊狀元素垂直外邊距重疊

一、垂直外邊距重疊

屬於同一個BFC的兩個相鄰盒子,垂直margin會發生重疊

二、重疊外邊距計算

1如果都是正邊界,邊界寬度是相鄰邊界寬度中最大的

2如果出現負邊界,則在最大的正邊界中減去絕對值最大的負邊界-||

3如果沒有正邊界,則從零中減去絕對值最大的負邊界

 

三、示例

1如果都是正邊界,邊界寬度是相鄰邊界寬度中最大的

div1{height:200px;width:200px;margin : 100px}

div2{height:200px;width:200px;margin : 50px}

結構:

<div class=“DIV1"></

div>

<div class=“DIV2"></div>

2如果出現負邊界,則在最大的正邊界中減去絕對值最大的負邊界-||

div1{margin : 100px}

div2{margin : -50px}

邊界=100px - |-50px|=50px

3如果沒有正邊界,則從零中減去絕對值最大的負邊界

div1{margin : -100px}

div2{margin : -200px}

邊界=0 - |-200px|= -200px