CSS向矩形添加圓形邊框 CSS（層疊樣式表）是一種用于網(wǎng)頁設(shè)計的樣式表語言。其中涉及到了許多常用的樣式特效，像是添加圓形邊框就是其中一種。 要使用 CSS 將圓形邊框添加到矩形元素中，請按如下步驟操作。 1. 選擇要添加圓形邊框的矩形元素。例如，我們可以通過以下 HTML 代碼創(chuàng)建一個矩形元素：

<div class="rectangle"></div>

2. 設(shè)置矩形元素的基本樣式。在這個例子中，我們將使用以下 CSS 代碼來為 `.rectangle` 定義位置，寬度和高度：

p {
margin: 20px 0;
}

3. 添加圓形邊框。通過使用 `border-radius` 屬性，我們可以將邊框的角落變成圓形。以下 CSS 代碼將為 `.rectangle` 添加 20px 的圓形邊框：

p {
margin: 20px 0;
border-radius: 20px;
}

4. 圖片上的圓形邊框。如果您不想在整個元素周圍添加一個圓形邊框，可以使用 `border-radius` 屬性來使圖像的角變圓。以下 CSS 代碼創(chuàng)建了一個帶有圓形邊框的圖像：

p {
margin: 20px 0;
}
img {
border: 5px solid white;
border-radius: 50%;
}

在上面的 CSS 例子中，我們使用 `border` 屬性設(shè)置了圖像的邊框樣式為 `solid`， 顏色為 `white`，并將其大小設(shè)置為 5px。然后用 `border-radius` 屬性將圖像周圍的邊框設(shè)置成了圓形。 總結(jié) CSS 允許將圓形邊框添加到矩形元素中。通過使用 `border-radius` 屬性，我們可以將元素的角變成圓形。編輯器中的示例代碼可以讓您更輕松地嘗試這種 CSS 樣式特效。