CSS繪制網格很容易。我們可以使用CSS的邊框屬性或者背景屬性來畫網格。

.grid {
display: grid;
grid-template-columns: repeat(5, 1fr);
grid-template-rows: repeat(5, 1fr);
}
.grid-item {
border: 1px solid black;
}

使用以上代碼，我們創建了一個包含25個網格子的網格，每個子網格為一個1/5之寬的列和1/5之高的行。由于我們在每個網格子中都設置了1像素的邊框，因此網格線呈現出清晰的線條。

如果您想要更細的網格線，可以使用CSS的偽類選擇器來實現：

.grid {
display: grid;
grid-template-columns: repeat(5, 1fr);
grid-template-rows: repeat(5, 1fr);
}
.grid-item {
border: 1px solid black;
}
.grid-item:before {
content: "";
position: absolute;
top: -1px;
left: -1px;
right: -1px;
bottom: -1px;
border: 1px solid gray;
}

在上面的代碼片段中，我們使用了:before偽類來創建網格線。我們設置了絕對定位，使得這個偽元素“覆蓋”在每個網格子上方。然后我們定義了一條1像素寬的灰色邊框，并且確保這條邊框與網格子有足夠的距離。

在CSS中，您不僅可以使用邊框來畫網格，還可以使用背景屬性。在以下示例中，我們將背景顏色設置為網格線的顏色：

.grid {
display: grid;
grid-template-columns: repeat(5, 1fr);
grid-template-rows: repeat(5, 1fr);
background-color: gray;
}
.grid-item {
background-color: white;
}

模擬出邊框時，你可以使用白色的背景色讓網格子看起來更好。

以上是三個簡單的方法，您可以使用它們來繪制出漂亮的網格。您可以嘗試添加不同的效果和樣式，以找到最適合您的網格的設計。