本文目錄導讀：

1. 使用border-radius屬性
2. 使用circle形狀
3. 使用mask形狀

如何用CSS繪制圓形？

CSS是一種強大的樣式表語言，可以用來描述HTML文檔的外觀和格式，繪制圓形是CSS中的一個常見應用，如何用CSS來繪制圓形呢？

使用border-radius屬性

CSS中的border-radius屬性可以用來設置元素的圓角，包括圓形，我們可以將元素的width和height屬性設置為相同的值，并使用border-radius屬性將其設置為***大值，從而繪制一個圓形。

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

使用circle形狀

CSS中的shape-outside屬性可以用來設置元素的形狀，包括圓形，我們可以將元素的shape-outside屬性設置為circle，并設置其大小，從而繪制一個圓形。

.circle {
  width: 100px;
  height: 100px;
  shape-outside: circle(50%);
}

使用mask形狀

CSS中的mask屬性可以用來設置元素的形狀，包括圓形，我們可以將元素的mask屬性設置為一個圓形的路徑，從而繪制一個圓形。

.circle {
  width: 100px;
  height: 100px;
  mask: circle(50%);
}

三種方法都可以用來繪制圓形，具體使用哪種方法取決于你的需求和瀏覽器兼容性，希望這篇文章能對你有所幫助！