CSS盒式模型是Web開發中常用的概念。它可以幫助我們了解一個HTML元素在頁面中所占據的空間。

/* 以下是一個簡單的例子： */
.box {
border: 1px solid #ccc;
padding: 12px;
margin: 24px;
width: 200px;
height: 100px;
}

在這個例子中，我們創建了一個類名為"box"的元素。我們為這個元素添加了邊框、內邊距（padding）、外邊距（margin）、寬度（width）和高度（height）等屬性。這些屬性構成了CSS盒式模型。

下面解釋一下這些屬性的意義：

邊框（border）：它是一個元素的邊框線，可以設置線條的寬度、樣式和顏色。

內邊距（padding）：它是元素內容與邊框之間的空間。如果沒有內邊距，元素的內容會直接與邊框接觸。

外邊距（margin）：它是元素與其它元素之間的空間。如果沒有外邊距，元素會與其它元素相鄰。

寬度（width）：它是元素的寬度。

高度（height）：它是元素的高度。

在上述例子中，我們定義了一個200像素寬、100像素高的盒子，并給它加上了12像素的內邊距和24像素的外邊距。同時，我們還為盒子加上了1像素寬的邊框，使它的邊框線變得可見。

<div class="box">
這里是盒子中的內容。
</div>

最后，我們將上述屬性應用于一個div元素，并將這個類名為"box"的元素插入到HTML文檔中。這樣，我們就得到了一個帶有邊框、內邊距和外邊距的200像素寬、100像素高的方形盒子。