第九課：box模式

CSS的box模式專門描述曾經用HTML元素創建的箱型。box模式還包括與邊緣（margin），邊界（border）,內襯（padding）和每個元素內容有關的詳細選擇。下面圖解展示了box模式的構成情況：

CSS中的box模式

上述實例看起來比較抽象，讓我們以實際的標題和一些文字進一步說明。

<h1>Article 1:</h1>

<p>All human beings are born free
and equal in dignity and rights.
They are endowed with reason and conscience
and should act towards one another in a
spirit of brotherhood</p>

通過添加一些色彩和文字信息，這個例子看起來會是這樣：

這個例子包含<h1>和<p>兩個元素。這兩個元素的box模式可以進一步舉例如下：

盡管看起來有些復雜，但圖例說明了每個HTML元素是如何被箱型圍繞的。可以用CSS調整箱型。調節box的不同特性是padding, margin和border。我們將在第十和十一兩課中詳細說明這三個特性。在你學完這兩課后，就能掌握box模式，并能更精確的處理文檔輸出樣式。

總結

這一課我們學習了怎樣使用box形式。在接下來的三課中，我們將進一步了解創建和控制箱型的元素。