我們可以用CSS 創建半圓形。在CSS 中創建半圓形是非常簡單的，我們只需要使用border-radius 屬性和偽元素（ :before 和 :after ）即可。實現方法如下：

.half-circle-top {
width: 50px;
height: 25px;
background-color: #ccc;
border-top-right-radius: 50px;
border-top-left-radius: 50px;
}
.half-circle-bottom {
width: 50px;
height: 25px;
background-color: #ccc;
border-bottom-right-radius: 50px;
border-bottom-left-radius: 50px;
}
/* 偽元素 創建半圓形 */
.half-circle:before {
content: "";
display: block;
width: 20px;
height: 10px;
background-color: #ccc;
border-top-right-radius: 10px;
border-top-left-radius: 10px;
}
.half-circle:after {
content: "";
display: block;
width: 20px;
height: 10px;
background-color: #ccc;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
}

以上代碼用于創建不同方向的半圓形。通過設置border-radius 屬性的值，我們可以創建任何形狀的圓形，而偽元素則允許我們在元素的前面或后面添加一個容器，視覺上類似于創建了一個新的元素。這樣，我們可以在不破壞HTML 結構的情況下創建更復雜的形狀。

總的來說，使用CSS 創建半圓形非常簡單。我們只需要使用border-radius 屬性和偽元素即可完成它。使用這種方法，我們能夠創造出各種形狀的圓形，并且不會對HTML結構造成破壞。