一、CSS下外邊距簡介

下外邊距指元素的底部邊緣與下一個元素的頂部邊緣之間的距離。CSS中通過margin-bottom屬性控制元素的下外邊距大小。如：margin-bottom:20px; 表示該元素下方與下一個元素的上方之間留有20px的距離。

二、CSS下外邊距的用法

1. 為獨立元素設置下外邊距
此時的下外邊距不會影響元素的其他外邊距，只會影響該元素與下一個元素之間的距離。
例如：
<div class="box">
<p>這是一個獨立元素</p>
</div>
<div class="box">
<p>這是一個獨立元素</p>
</div>
.box {
margin-bottom:20px;
}
2. 為相鄰元素設置下外邊距
當前一個元素設置了下外邊距時，會與下一個元素的外邊距合并，取兩者之中較大的那個值作為它們之間的距離。
例如：
<div class="box">
<p>這是第一個元素</p>
</div>
<div class="box">
<p>這是第二個元素</p>
</div>
.box p {
margin-bottom:10px;
}
.box {
margin-bottom:20px;
}
此時，兩個div之間的距離為20px，而兩個p之間的距離為10px。

三、CSS下外邊距的注意事項

1. 相鄰元素的下外邊距合并僅限于垂直方向，不適用于水平方向。
2. 當父元素設置了下外邊距時，如果它的第一個子元素沒有上外邊距，那么父元素下外邊距與第一個子元素的上外邊距會合并。
3. 在使用CSS框架時，需要注意框架內(nèi)的樣式可能會影響元素的下外邊距，需要進行適當?shù)恼{(diào)整。