CSS可以通過調整布局和樣式來營造9宮格的效果。

/* 設置九宮格的寬度和高度 */
.container {
width: 300px;
height: 300px;
display: flex;
flex-wrap: wrap;
}
/* 設置每個格子的寬度和高度 */
.box {
width: 100px;
height: 100px;
}
/* 設置每個格子的背景顏色和邊框 */
.box:nth-child(1),
.box:nth-child(3),
.box:nth-child(4),
.box:nth-child(6) {
background-color: #eee;
border: 2px solid #999;
}
.box:nth-child(2),
.box:nth-child(5),
.box:nth-child(8) {
background-color: #aaa;
border: 2px solid #666;
}
.box:nth-child(7),
.box:nth-child(9) {
background-color: #444;
border: 2px solid #333;
}

以上CSS代碼可以實現一個簡單的9宮格，通過修改每個格子的背景顏色和邊框，可以實現不同的效果。