在CSS中，我們經(jīng)常會使用矩形元素來布局和排版網(wǎng)頁。但是，有時候我們需要給矩形元素的一邊加上弧度，使其看起來更加美觀和有趣。

.example {
width: 200px;
height: 100px;
border: none;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
background-color: #ccc;
}

上面的代碼展示了一個有左邊弧度的矩形元素示例。我們使用了border-radius屬性來實現(xiàn)弧度效果，并將弧度值設(shè)置為20像素，這樣就可以看到左邊的邊框是有弧度的了。

除此之外，我們還可以使用border-top-right-radius和border-bottom-right-radius屬性來分別實現(xiàn)右上角和右下角的弧度效果。如果同時需要設(shè)置四個角的弧度，可以使用border-radius屬性，其語法如下：

.example {
border-radius: 20px 20px 0px 0px;
}

上面的代碼中，border-radius屬性接受四個值，分別代表左上角、右上角、右下角和左下角的弧度值。我們可以根據(jù)實際需要來設(shè)置每個角的弧度大小，從而獲得想要的效果。

總之，CSS中的弧度效果可以幫助我們實現(xiàn)更加豐富、美觀和有趣的頁面布局和排版。在實際應(yīng)用中，可以根據(jù)需要使用不同的弧度值和不同的屬性組合來實現(xiàn)各種效果。