CSS中制作圓角矩形可以使用border-radius屬性。

border-radius屬性可以設(shè)置元素的邊框圓角。屬性值可以是一個(gè)或四個(gè)數(shù)值，分別表示四個(gè)角的圓角大小。如果只設(shè)置一個(gè)數(shù)值，則四個(gè)角的圓角大小相等。

例如，下列代碼可以制作一個(gè)4個(gè)角都為10px的圓角矩形：

div {
border-radius: 10px;
}

如果只想設(shè)置上下兩個(gè)角為圓角，可以這樣寫(xiě)：

div {
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}

同理，設(shè)置左上、右上、左下、右下角也可以使用border-xx-xx-radius屬性。

另外，可以使用較新的CSS3語(yǔ)法，將border-radius寫(xiě)成一個(gè)簡(jiǎn)寫(xiě)的形式：

div {
border-radius: 10px 5px 15px 20px;
}

這個(gè)簡(jiǎn)寫(xiě)的形式表示，上左、上右、下右、下左的圓角大小分別為10px、5px、15px、20px。

總的來(lái)說(shuō)，border-radius屬性非常方便用來(lái)制作圓角矩形。