CSS圆角 border-radius属性详解:
warning:
这篇文章距离上次修改已过441天，其中的内容可能已经有所变动。
CSS的border-radius属性用于设置元素的圆角。它可以接受1到4个值，分别对应一个或多个圆角。
基本语法如下：
border-radius: 1-4 length | percentage;其中，length是一个长度值，比如像素(px)或em，percentage是相对于元素的宽度或高度的百分比。
示例代码：
/* 所有圆角都是10像素 */
div {
border-radius: 10px;
}
/* 水平圆角为10像素，垂直圆角为5像素 */
div {
border-radius: 10px 5px;
}
/* 左上角和右下角是10像素，右上角和左下角是5像素 */
div {
border-radius: 10px 5px 15px 20px; /* 顺时针方向 */
}
/* 使用百分比 */
div {
border-radius: 50%;
}border-radius可以设置为一个值（正圆形）、两个值（横向和纵向圆角分别设置）、三个值（一个四边形）或四个值（独立设置每个角）。当设置为50%时，会形成一个完美的圆形。
评论已关闭