如何使用 HTML 和 CSS 建立圓形元素？

使用HTML 和CSS 建立圓形元素

在HTML5 和CSS3 中繪製圓形需要一種解決方法，因為這些技術缺乏圓形形狀的本機支援。但是，您可以透過建立帶有圓角的矩形來模擬圓形。

邊框半徑：圓角的關鍵

要建立圓角，您需要利用 CSS 的 border-radius 屬性。將其值設為所需圓的寬度和高度的一半，您可以實現半圓形。

例如，直徑為50px的圓需要邊框-半徑為25 像素：

#circle {
  width: 50px;
  height: 50px;
  border-radius: 25px;
  background: red;
}

新增文字Inside

要將文字放置在模擬圓圈內，請將文字括在

<div> 內。元素：

<div>