CSS是一種很強大的樣式表語言，可以用來控制網頁的樣式和排版。今天我們來學習一個如何使用CSS畫出兩個圓圈連接的方法。

.circle {
width: 50px;
height: 50px;
border-radius: 50%;
background-color: red;
position: absolute;
}
.circle1 {
top: 50px;
}
.circle2 {
left: 50px;
}

首先，我們需要制作兩個圓圈，一個在上面，一個在下面。我們可以使用CSS的border-radius屬性來制作圓形，再加上背景顏色。使用position屬性將兩個圓圈定位，一個在上方，一個在左側。

.line {
width: 50px;
height: 70px;
border-left: 2px solid black;
position: absolute;
top: 50px;
left: 25px;
}

然后，我們需要制作一個連接圓圈的線條。使用CSS的border-left屬性制作一條豎線，并使用position屬性將其定位在兩個圓圈之間。

.container {
position: relative;
width: 100px;
height: 120px;
}

最后，我們需要將兩個圓圈和連接線放在一個容器中，并使用position屬性將其相對定位。

通過以上代碼，我們就能夠成功畫出兩個圓圈連接的圖形。不僅如此，CSS的樣式表語言還能夠讓我們做出更多樣式和排版效果，使得網頁更加精美。