CSS盒模型是指在網頁布局中，將HTML元素看做一個盒子。每個盒子由四個部分組成——內容區域、內邊距、邊框和外邊距。

.box {
width: 300px;
height: 200px;
padding: 20px;
border: 5px solid red;
margin: 30px;
}

層疊順序（z-index）用于控制元素在文檔流中的顯示順序。z-index的值越高，元素在上層，越低則在下層。當多個元素重疊在一起時，利用z-index可以控制它們的顯示順序。

.header {
z-index: 2;
}
.content {
z-index: 1;
}
.footer {
z-index: 3;
}

例如，當網頁中的導航欄和側邊欄出現重疊時，我們可以通過設置它們的z-index值使導航欄在上面，側邊欄在下面。

.nav {
position: absolute;
top: 0;
left: 0;
z-index: 2;
}
.sidebar {
position: absolute;
top: 50px;
left: 0;
z-index: 1;
}

但是，z-index的設置必須在元素的定位屬性（position）為absolute、fixed或relative的情況下才能生效。

總之，掌握盒模型和層疊順序可以幫助我們更好地控制HTML元素在網頁中的布局和顯示效果。