圆角属性示例：
.rounded-box {
border-radius: 10px; /* 所有四个角都具有 10px 的圆角 */
}
.custom-rounded {
border-top-left-radius: 15px; /* 左上角 15px 圆角 */
border-top-right-radius: 5px; /* 右上角 5px 圆角 */
border-bottom-left-radius: 20px; /* 左下角 20px 圆角 */
border-bottom-right-radius: 0; /* 右下角无圆角 */
}
在这个示例中，.rounded-box 类的元素将具有所有四个角都是 10px 的圆角。而.custom-rounded 类的元素则展示了如何分别设置每个角的圆角半径。你可以根据需要灵活组合这些属性来创建不同形状的圆角。
值得注意的是，border-radius 属性也支持椭圆形的定义，你可以提供两个值，分别表示水平和垂直方向上的圆角半径。例如：
.ellipse {
border-radius: 20px 10px; /* 水平方向 20px 圆角，垂直方向 10px 圆角 */
}
这种方式允许你创建更为复杂的圆角形状。CSS3 圆角属性使得设计中更多的元素可以采用圆润的外观，提升用户体验。
转载请注明出处：http://www.zyzy.cn/article/detail/4057/CSS