< p >CSS標準模型盒是網頁設計中重要的概念，它確定了HTML元素的大小和位置，使得我們可以有效地控制網頁布局。每個HTML元素都可以視為一個矩形盒子，該盒子的大小由元素的內容、邊框、內邊距和外邊距組成。以下是CSS標準模型盒的組成部分：< /p >< pre >+-------------------------------+ | margin | | +-----------------------+ | | | border | | | | +-----------------+ | | | | | padding | | | | | | +-----------+ | | | | | | | content | | | | | | | +-----------+ | | | | | +-----------------+ | | | +-----------------------+ | +-------------------------------+< /pre >< p >從上面的圖形中可以看出，一個HTML元素包含多個部分，每個部分都可以定制。以< span >標簽為例，我們可以通過以下方式改變它的每個部分的樣式：< /p >< pre >span { margin: 10px; padding: 5px; border: 1px solid black; background-color: gray; color: white; }< /pre >< p >上面的樣式代碼將< span >標簽包含的文本放在一個灰色的矩形盒子里，該盒子外有10像素的外邊距，5像素的內邊距和1像素黑色的邊框。文本顏色為白色。< /p >