如何用CSS畫奧運五環？下面給出一個簡單的示例，建議使用pre標簽查看代碼。

/* 準備工作 */
.olympic-rings {
width: 300px;
height: 300px;
margin: 0 auto;
position: relative;
}
/* 畫圓 */
.olympic-circle {
width: 60px;
height: 60px;
border: 10px solid #000;
border-radius: 50%;
position: absolute;
}
/* 第一個圓，藍色 */
.olympic-circle.blue {
top: 0;
left: 0;
}
/* 第二個圓，黃色 */
.olympic-circle.yellow {
top: 0;
left: 80px;
}
/* 第三個圓，黑色 */
.olympic-circle.black {
top: 50px;
left: 40px;
}
/* 第四個圓，綠色 */
.olympic-circle.green {
top: 50px;
left: 120px;
}
/* 第五個圓，紅色 */
.olympic-circle.red {
top: 25px;
left: 60px;
}
/* 渲染HTML */

上面的代碼中，首先我們創建一個容器 .olympic-rings 來包含五個圓，然后使用 position: absolute; 和一些簡單的計算，確定每個圓的位置和顏色。最后將每個圓渲染到 HTML 中。

關于如何畫一個圓，我們使用 border-radius: 50%; 來設置圓角半徑。同時設置寬度和高度保證圓是等比例的。邊框的寬度和顏色可以根據喜好自己調整。

還有一些細節可以根據具體要求進行修改，比如容器的大小和位置，圓的大小和間距等等。如果需要更加復雜的圖形，可以繼續深挖 CSS 的高級技巧。