使用CSS為元素添加上邊框有弧度是一個十分實用的技巧。在實際的網頁設計中，上邊框有弧度可以使元素的外觀更加美觀，同時還能提高用戶體驗。下面將介紹兩種實現上邊框有弧度的方法。 方法一：使用邊框半徑（border-radius）屬性 在CSS3中，使用邊框半徑（border-radius）屬性可以很方便地為元素添加圓角效果。邊框半徑屬性包含四個值，分別表示四個角的半徑大小。當四個值的大小都相同時，就會出現一個完美的圓角。若需要只改變上邊框的邊角時，在上方加上一個0值即可。 例如：

.box {
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border: 2px solid #000;
padding: 10px;
}

上面這段代碼會使.box類的元素在上方的左右兩個角落各出現一個10像素的圓角。 方法二：使用偽元素（pseudo-elements） 偽元素是CSS的一種高級技巧，可以添加一些不存在于HTML文檔中的元素。使用偽元素可以輕松地為元素添加一些額外的效果，例如前面的弧度效果。 例如：

.box {
border: 2px solid #000;
position: relative;
padding: 10px;
}
.box::before {
content: "";
position: absolute;
top: -10px;
left: 0;
right: 0;
height: 10px;
background: #000;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}

在上面這段代碼中，使用了偽元素::before來為.box類的元素添加上邊框弧度效果。其中，top: -10px;屬性可以使偽元素的位置在元素的上方，left: 0;和right: 0;屬性可以使偽元素的寬度與元素的寬度一致，達到與上邊框一樣的效果，而border-top-left-radius: 10px;和border-top-right-radius: 10px;屬性則是實現了上邊框兩端的圓角效果。 總結 以上是兩種實現CSS上邊框有弧度的方法，大家可以根據自己的需求選擇一種并進行使用。在實際開發工作中要善于使用CSS技巧，既可以提高開發效率，也能為網頁設計增色不少。