問題：
如何僅使用CSS 建立半圓，使用單一div 元素且不依賴SVG 或圖形API 等外部工具？
答案：
使用 CSS 實現半圓效果可以透過利用邊框屬性。若要執行此操作：
border-top-left-radius: 110px; // Height + Border border-top-right-radius: 110px; // Height + Border
border: 10px solid gray; border-bottom: 0;
圓角和邊框的這種組合創建半圓形。
範例：
<code class="css">.half-circle {
width: 200px;
height: 100px;
border-top-left-radius: 110px;
border-top-right-radius: 110px;
border: 10px solid gray;
border-bottom: 0;
}</code>取代方法：
另一個方法是使用box-sizing: border- box，它計算盒子的寬度和高度包括邊框和填充。這樣，您就可以將高度指定為寬度的一半：
<code class="css">.half-circle {
width: 200px;
height: 100px;
border-top-left-radius: 100px;
border-top-right-radius: 100px;
border: 10px solid gray;
border-bottom: 0;
box-sizing: border-box;
}</code>這兩種方法都可以使用純 CSS 技術來實現所需的半圓效果。
以上是如何使用單一 Div 透過 CSS 創建半圓？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
