CSS四角边
在CSS中，我们可以使用四个独立的
属性来控制
一个元素的四角边：border-top-left-radius、border-top-right-radius、border-b
ottom-left-radius和border-b
ottom-right-radius。这些
属性可以让我们创建圆角，使我们的界面更加美观。
在这里我们可以给出
一个简单的例子，将
一个div元素的四个角变为圆角：
div {
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-b
ottom-left-radius: 10px;
border-b
ottom-right-radius: 10px;
}
上述
代码将
一个div元素的四个角都变为了10像素的圆角。我们也可以使用单个
属性来控制
一个元素的所有四个角：border-radius。比如，我们可以使用下面的
代码给所有img元素
添加圆角：
img {
border-radius: 50%;
}
上述
代码将所有img元素的四个角都变为了50%的圆角，也就是将他们变成了圆形。值得注意的是，我们也可以为不同的角度设置不同的圆角半径。比如下面的
代码将
一个元素的左下角半径设置为10px，右下角半径设置为20px，右上角半径设置为30px，
左上角半径设置为40px：
div {
border-b
ottom-left-radius: 10px;
border-b
ottom-right-radius: 20px;
border-top-right-radius: 30px;
border-top-left-radius: 40px;
}
CSS四角边提供了
一个简单而有趣的
方法来改善我们的界面设计，可以让我们的网站更加美观。
