今天我們?cè)谝黄饋?lái)看看CSS3中制作圓角的屬性border-radius的具體用法，

CSS3中的border-radius出現(xiàn)后，應(yīng)用相當(dāng)廣泛，使用簡(jiǎn)單，無(wú)需再處理圖片，時(shí)間是省了，而且其還有多個(gè)優(yōu)點(diǎn)：其一減少網(wǎng)站的維護(hù)的工作量，少了對(duì)圖片的更新制作，代碼的替換等等;其二、提高網(wǎng)站的性能，少了對(duì)圖片進(jìn)行http的請(qǐng)求，網(wǎng)頁(yè)的載入速度將變快；其三增加視覺(jué)美觀性。既然border-radius有這么多好處，我們就從他的語(yǔ)法，屬性和屬性值等方面來(lái)看其如何應(yīng)用。

有這么多，那我們就從示例開(kāi)始吧：

向 div 元素添加圓角邊框：

div

{

border:2px solid;

border-radius:25px;

}

例子 1

border-radius:2em;

等價(jià)于：

border-top-left-radius:2em; //左上角

border-top-right-radius:2em; //右上角

border-bottom-right-radius:2em; //右下角

border-bottom-left-radius:2em; //左上角