CSS可以輕松地在頁面上創建各種各樣的形狀和構造。其中一個有趣的例子就是將五個圓形嵌套在一個大圓形中間。下面是實現這一效果的代碼：

.circle {
width: 200px;
height: 200px;
border-radius: 50%;
background-color: lightblue;
position: relative;
}
.circle:before, .circle:after {
content: "";
display: block;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
border-radius: 50%;
}
.circle:before {
width: 160px;
height: 160px;
background-color: white;
}
.circle:after {
width: 120px;
height: 120px;
background-color: lightblue;
}
.circle div {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 60px;
height: 60px;
border-radius: 50%;
background-color: white;
}
.circle div:nth-child(1) {
transform: translate(-50%, -140%);
}
.circle div:nth-child(2) {
transform: translate(28%, -117%);
}
.circle div:nth-child(3) {
transform: translate(117%, -3%);
}
.circle div:nth-child(4) {
transform: translate(28%, 110%);
}
.circle div:nth-child(5) {
transform: translate(-42%, 110%);
}

首先，我們創建一個大圓形的容器，使用border-radius將其變成一個圓形。然后，在容器中使用:before和:after偽元素創建兩個圓形，分別作為中空部分和外環。

接下來，我們在容器中創建五個小圓形。這里使用絕對定位和transform屬性將它們放在正確的位置。注意，我們使用了:nth-child選擇器來選擇每一個小圓形，并且為它們賦予不同的位置。

通過組合這個代碼塊，我們就實現了大圓形中嵌套五個小圓形的效果。這個例子展示了CSS是多么強大和靈活。它可以幫助我們輕松地實現各種各樣的設計想法。