CSS中的margin屬性用于控制元素的外邊距。當我們需要將多個元素相互貼合排列時,就需要使用margin進行調整。但是,在某些情況下,我們需要對多個元素進行margin相加,以便達到更好的排列效果。
/* 例子1 */ .container{ margin-top: 50px; margin-bottom: 50px; } .item{ margin-top: 20px; } /* 例子2 */ .container{ margin: 30px; } .item{ margin: 20px; }
上面的代碼中,我們可以看到兩個例子,都使用了margin相加的效果。在例子1中,container元素給定了上下50px的margin值,item元素給定了20px的margin-top值。我們可以發現,當item元素與container元素相遇時,它們之間的距離應該是70px而不是50px。
而在例子2中,container元素和item元素都給定了30px的margin值。我們需要將它們相加,得到的間距應該是50px而不是60px。
掌握margin相加的技巧,可以讓我們在進行頁面布局時更加得心應手。但是,需要注意的是,margin的相加并不是簡單地累加值,還需要考慮margin的合并規則。
上一篇css3圖片2秒內擴大
下一篇css name和id