CSS 可以很簡單地幫助我們畫出各種形狀的圖形，其中包括圓形。下面我們來看一下如何使用 CSS 畫出圓形。

.circle {
width: 100px;
height: 100px;
border-radius: 50%;
background-color: #f00;
}

代碼解釋：

首先，我們定義了一個 .circle 類，以便今后可以在 HTML 中應用它。然后我們設置它的寬度和高度都為 100 像素，這使得它成為一個正方形。接下來，我們使用 border-radius 屬性來定義一個 50% 的圓角，這將把正方形變成一個圓形。最后，我們設置了背景顏色為紅色。

現在，在我們的 HTML 中，我們可以這樣使用 .circle 類名：

<div class="circle"></div>

我們會看到一個紅色的圓形，它的寬度和高度都是 100 像素。

如果我們想要一個不同大小或顏色的圓形怎么辦？我們只需要修改我們的 CSS。

.circle {
width: 50px;
height: 50px;
border-radius: 50%;
background-color: #00f;
}

這個圓形的寬度和高度都是 50 像素，并且它的顏色為藍色。我們可以在 HTML 中用相同的方式使用它。

因此，CSS 的 border-radius 屬性是畫圓形的關鍵，你只需要將它的值設置為50%，并且在需要的時候，以不同的大小和顏色應用你的類名即可。