CSS是網頁中不可或缺的一部分，其中一個非常實用的功能就是制作圓形塊。接下來，我們將介紹如何使用CSS制作圓形塊。

/* 設置圓形塊的寬高相同 */
.circle {
width: 50px;
height: 50px;
border-radius: 50%; /* 將四角改為圓角 */
background-color: #f00; /* 設置背景顏色 */
}

如上代碼所示，我們可以通過設置元素的寬和高相同，并將四個角的半徑設置為50%來制作圓形塊。此外，我們還可以通過設置背景顏色來為圓形塊添加顏色。

除此之外，我們也可以利用偽元素來制作圓形塊。

/* 利用偽元素制作圓形塊 */
.circle::before {
content: "";
display: block; /* 將偽元素設置為塊級元素 */
width: 50px;
height: 50px;
border-radius: 50%;
background-color: #f00;
}

如上代碼所示，我們可以利用偽元素“::before”來向元素中添加一個圓形塊并設置其樣式。需要注意的是，偽元素默認為行內元素，需要將其設置為塊級元素才能生效。

無論是哪種方式，通過CSS制作圓形塊都非常簡單。相信掌握了這個知識點后，大家的網頁設計能力一定會得到進一步提升。