在前端開發中，我們常常需要使用CSS來實現不同形狀的圖形。其中，一個比較常見的需求就是使用小圓組成大圓。

.circle-container {
display: flex;
justify-content: center;
align-items: center;
width: 300px;
height: 300px;
border-radius: 50%;
background-color: #ddd;
}
.circle {
width: 40px;
height: 40px;
border-radius: 50%;
margin-right: 10px;
background-color: #333;
}

這段CSS代碼實現了一個圓形容器，容器本身的形狀是由border-radius屬性實現的，將其設置為50%即可。而容器內部則是使用小圓來填充的。這里，我們用一個.circle類來實現小圓的樣式，包括寬度、高度、邊框半徑、間距和背景顏色等。

然后，我們便可以在HTML中使用這些CSS類來實現效果了：

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

這里我們在.circle-container內部嵌套了9個.circle元素，并設置它們的樣式為.circle類。因為容器寬和高都是300px，所以圓形的直徑就是300px，也就剛好夠放下9個小圓。

最終效果如下：

這樣，我們就用CSS實現了小圓組成大圓的效果。實現的方法非常簡單，但是可以用于很多場合，如小圓點、進度條等等。