摘要：當兩個及以上外邊距折疊，合并后的外邊距寬度是發生折疊的外邊距中的最大寬度。如果該元素的外邊距同其父元素的上外邊距折疊，則該盒的上邊框邊緣同其父元盒的上邊框邊緣相同。

2017-07-20: 關于外邊距折疊, 推薦問題: https://segmentfault.com/q/10...

URL: http://www.w3.org/TR/CSS2/box...
Translator : HaoyCn
Date: 15th of Aug, 2015

譯者注：本譯文僅擇精要部分翻譯了規范，主要描述了盒模型結構，以及重點分析外邊距折疊。個人水平有限，歡迎指正！

CSS盒模型所描述的矩形盒由文檔樹內的元素生成，根據視覺格式化模型布局。

每個盒都有一個內容區域 Content （如，文本，圖片等）以及可選的圍繞在周圍的內邊距、邊框和外邊距區域；每個區域的大小由本文后述的屬性指定。下圖展示了這些區域的關聯以及用于描述外邊距、邊框和內邊距的各部分的術語。

外邊距、邊框和內邊距可以被分解到上、右、下、左各部分（如，在上圖中， LM 表示左外邊距， RP 表示右內邊距， TB 表示上邊框等）。

四種區域（內容、內邊距、邊框、外邊距）的邊界被稱作一個“邊緣 Edge ”，因此每個盒有四種邊緣：

內容邊緣 Content Edge 或內邊緣 Inner Edge

內容邊緣圍繞著由盒的寬和高所指定的矩形，該矩形通常由元素的已渲染內容 Rendered Content 所決定。四個內容邊緣規定了盒的內容盒 Content Box 。

內邊距邊緣

內邊距邊緣圍繞著盒的內邊距。如果內邊距寬度為0，則內邊距邊緣即是內容邊緣。四個內邊距邊緣規定了盒的內邊距盒 Padding Box 。

邊框邊緣

邊框邊緣圍繞著盒的邊框。如果邊框寬度為0，則邊框邊緣即是內邊距邊緣。四個邊框邊緣規定了盒的邊框盒 Border Box 。

外邊距邊緣或外邊緣

外邊距邊緣圍繞著盒的外邊距。如果外邊距寬度為0，則外邊距邊緣即邊框邊緣。四個外邊距邊緣規定了盒的外邊距盒 Margin Box 。

每個邊緣都可以被分解成上、右、下、左邊緣。

盒內容區域的尺寸——即內容寬度 Content Width 和內容高度 Content Width ——由這些因素所決定：生成盒的元素是否設置了 width 和 height 屬性；盒是否包含了文本或其他盒；盒是否為表格；等等。盒的寬度和高度將在視覺格式化模型詳述一章中討論。

盒的內容、內邊距以及邊框區域的背景樣式由生成盒的元素的 background 屬性所規定。外邊距的背景始終為透明。

下例展示了外邊距、內邊距和邊框如何交互。HTML文檔：