CSS盒子層疊是CSS中非常重要的一個概念。在CSS中，每一個元素都是一個盒子，而這些盒子可以重疊在一起，形成層疊效果。當多個盒子重疊在一起時，就需要了解CSS盒模型及層疊順序來確定它們的顯示順序。

CSS盒模型指的是一個元素被看做一個矩形盒子，包括內容區域、內邊距、邊框和外邊距四個部分。這個盒子的大小可以通過width和height屬性來控制，而邊框、內邊距以及外邊距則可以通過對應的屬性來設定。

.box{
width: 200px;
height: 200px;
padding: 20px;
border: 1px solid black;
margin: 20px;
}

層疊順序指的是當多個盒子重疊在一起時，瀏覽器會根據其所處的層疊上下文以及z-index屬性值來決定盒子的顯示順序。

在同一層疊上下文中，z-index值越高的元素越會在上層顯示。當兩個元素層疊上下文不同時，它們的層疊關系就不再受z-index控制，而是由它們在文檔流中出現的順序決定。同時，如果兩個元素z-index值相同，則靠后出現的元素會在上層顯示。

可以使用z-index屬性來設定元素的層疊順序，數值越高，顯示在上層的可能性就越大。

.box1{
z-index: 1;
}
.box2{
z-index: 2;
}

通過了解CSS盒子模型及層疊順序，我們就可以在頁面布局中靈活使用CSS盒子層疊，達到更好的視覺效果。