CSS中有一個(gè)非常常用的屬性，它可以讓元素的邊角變圓。這個(gè)屬性就是border-radius。

border-radius: 50%;

通過(guò)設(shè)置border-radius，我們可以將元素的四個(gè)角變成圓角。您可以為該屬性指定一個(gè)值，這個(gè)值表示圓角的圓度，也稱為圓角半徑。

border-radius: 20px;

除了可以將所有四個(gè)角都變圓外，border-radius還可以指定單獨(dú)的角來(lái)變圓。我們可以使用類似于如下代碼的方式指定每個(gè)角的圓角半徑：

border-top-left-radius: 5px;
border-top-right-radius: 10px;
border-bottom-right-radius: 20px;
border-bottom-left-radius: 35px;

如果您希望將某個(gè)角變成橢圓形或不規(guī)則形狀，可以使用下面的代碼：

border-top-right-radius: 100px 50px;

其中第一個(gè)值表示圓角半徑的水平半徑，第二個(gè)值表示垂直半徑。

如您所見(jiàn)，border-radius是一種非常實(shí)用的CSS屬性，能夠讓我們輕松地美化頁(yè)面元素。