CSS3是一種強大的樣式語言，可以為網頁提供豐富的排版和設計效果。其中一個常用的功能是制作空心圓。下面我們來學習如何使用CSS3來制作空心圓。

.circle {
width: 50px;
height: 50px;
border: 5px solid green;
border-radius: 50%;
}

在上面的代碼中，我們首先定義了一個圓形的容器，通過設置容器的寬、高和邊框，實現了空心效果。同時，通過設置border-radius屬性為50%，把容器的邊角都設置為圓形，從而實現了空心圓的效果。我們也可以通過改變border的顏色和粗細，來實現不同樣式的空心圓。

除了使用border屬性，我們還可以通過box-shadow屬性來制作空心圓。下面是一個例子：

.shadow-circle {
width: 50px;
height: 50px;
border-radius: 50%;
box-shadow: 0 0 0 5px green;
}

在這個例子中，我們沒有設置邊框，而是使用了box-shadow屬性。該屬性用于設置元素的陰影效果，通過設置陰影的位置、模糊程度和顏色等屬性，來實現不同的效果。在這個例子中，我們設置了一個半徑為5px的陰影，通過調節這個半徑的大小，可以實現不同樣式的空心圓。

通過上面的例子，我們可以看到，CSS3提供了多種方法來制作空心圓。無論是使用border屬性還是box-shadow屬性，都能夠實現簡單而美觀的效果。在實際開發中，我們可以根據需要選擇不同的方法，來實現所需的效果。