CSS 圖片網格布局是一種將網頁上的圖片按照特定的規則排列的技術。它可以讓我們在網頁上更好地展示圖片，增加網頁的美觀性和實用性。

.grid-container {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
grid-gap: 10px;
}
.grid-item {
width: 100%;
height: auto;
background-position: center;
background-size: cover;
}

上面的代碼是一個簡單的圖片網格布局示例。首先，我們使用 display: grid 屬性將父容器設為網格布局。然后，我們使用 grid-template-columns 屬性設置列的數量和寬度。這里我們使用了 repeat() 函數來自動填充列，minmax() 函數來設置列的最小和最大寬度。最后，我們設置了 grid-gap 屬性來設置列之間的間距。

接著，我們定義了.grid-item 類，它是每個網格單元的樣式。我們設置了 width 和 height 屬性，使得圖片可以被完整地展示，并且使用了 background-position 和 background-size 屬性來優化圖片的展示效果。

在網頁中，我們可以使用類似下面的 HTML 代碼來應用這個布局：

最后，我們可以根據具體的需求對圖片網格布局進行優化和調整。