今天我們來學習如何使用CSS來實現一個半圓

首先我們需要先確定一個div或者span標簽，然后將它的寬度和高度設為相等

.circle {
width: 100px;
height: 100px;
}

接下來，我們使用border-radius屬性將它的四個角都設置成半徑為50%的圓角，這樣整個div或span標簽就變成了一個圓形

.circle {
width: 100px;
height: 100px;
border-radius: 50%;
}

現在我們來實現半圓的效果，我們需要先將它的border-bottom-left-radius和border-bottom-right-radius屬性都設為0，這樣底部兩個角就變成了直角

.circle {
width: 100px;
height: 100px;
border-radius: 50% 50% 0 0;
}

最后，我們使用transform屬性將它旋轉180度，就可以得到一個完美的半圓形了

.circle {
width: 100px;
height: 100px;
border-radius: 50% 50% 0 0;
transform: rotate(180deg);
}