在CSS中,可以使用border-radius
屬性來(lái)使矩形框的邊緣圓滑,該屬性接受四個(gè)值,分別代表矩形四個(gè)角的圓角半徑,如果只需要讓矩形框的四個(gè)角都圓滑,可以設(shè)置一個(gè)值;如果只需要讓矩形框的某個(gè)角圓滑,可以設(shè)置相應(yīng)的值。
將矩形框的四個(gè)角都設(shè)置為圓滑,可以使用以下CSS代碼:
.box { border-radius: 10px; }
如果只需要讓矩形框的左上角和右下角圓滑,可以使用以下CSS代碼:
.box { border-radius: 10px 0 0 10px; }
10px
表示圓角半徑的大小,0
表示直角,可以根據(jù)需要設(shè)置不同的值。
還可以使用border-radius
屬性的百分比形式來(lái)設(shè)置圓角半徑的大小,
.box { border-radius: 50%; }
這將使矩形框的四個(gè)角都設(shè)置為半圓形。
使用border-radius
屬性可以輕松地使矩形框的邊緣圓滑,達(dá)到更加美觀的效果。