CSS中可以通過(guò)一個(gè)叫做border-radius屬性來(lái)實(shí)現(xiàn)圓角效果。這個(gè)屬性可以控制所有四個(gè)角的圓角程度，也可以單獨(dú)控制上下左右四個(gè)方位的圓角，具體步驟如下。

/*只有上邊圓角實(shí)現(xiàn)步驟*/
border-top-left-radius: 30px;   /*左上角圓角*/
border-top-right-radius: 30px;  /*右上角圓角*/
border-bottom-right-radius: 0;  /*右下角圓角*/
border-bottom-left-radius: 0;   /*左下角圓角*/

通過(guò)以上代碼，我們可以實(shí)現(xiàn)只有上邊拐角是圓角的圖片效果。其中需要注意的是，如果需要讓下邊拐角也是直角，則可以將border-bottom-right-radius和border-bottom-left-radius的值分別設(shè)為0。

除了只有上邊圓角，我們也可以實(shí)現(xiàn)只有下邊圓角、只有左邊圓角、只有右邊圓角、只有左上角圓角、只有右上角圓角、只有左下角圓角或者只有右下角圓角的效果。只需要按照上述步驟進(jìn)行修改對(duì)應(yīng)的border-radius屬性即可。