CSS模型盒子是網頁布局中十分重要的概念。在CSS中，每一個HTML元素都被看做是一個矩形的盒子。這個盒子的大小、邊距、邊框和內邊距都有自己的特定屬性。CSS模型盒子有幾種不同的類型，每種類型都有著自己的特點和用途。
第一種類型是塊級盒子，它是最基本的盒子類型。塊級盒子可以包含其他的塊級盒子或內聯盒子，并且每一個塊級盒子都會占據整個可用的寬度。你可以用以下的CSS代碼來設置一個塊級盒子：

p {
display: block;
border: 1px solid black;
padding: 10px;
}

在這里，我們用了display屬性來設置p標簽為一個塊級盒子。同時，我們設置了邊框和內邊距來控制盒子的大小。
第二種類型是內聯盒子。如果你想把一些文本包含到一個盒子里，而又不想讓這個盒子占據整個行的寬度，那么內聯盒子就是你需要的。內聯盒子可以作為其他的內聯盒子的容器，但是它們不能包含塊級盒子。以下是設置內聯盒子樣式的CSS代碼：

span {
display: inline;
border: 1px solid black;
padding: 5px;
}

在這里，我們設置了display屬性為inline，這樣p標簽內的所有span標簽都被設置為內聯盒子了。
第三種類型是表格盒子。表格盒子是HTML表格的盒子模型。表格盒子可以包含行和列，每一行和列都可以是塊級盒子或內聯盒子。表格盒子還可以設置表格的寬度、邊距和邊框。這是一個設置表格盒子樣式的CSS代碼：

table {
border-collapse: collapse;
border: 1px solid black;
width: 100%;
}
td {
border: 1px solid black;
padding: 5px;
}

在這里，我們設置了表格盒子的邊框和寬度。我們也設置了每一個單元格的邊框和內邊距。
總結來說，CSS模型盒子有三種類型：塊級盒子、內聯盒子和表格盒子。每種類型都有自己的特點和用途。學習如何掌握這些盒子模型非常重要，因為它們是網頁布局的基礎。