css圆角属性w3c |css 框架托管

{
border-radius: [参数];
}

参数可以是单个值，也可以是多个值。单个值将应用于所有四个角，而多个值将应用于不同角。以下是一些使用border-radius的示例：

/* 设置所有四个角都是30px */
{
border-radius: 30px;
}
/* 将左上角和右下角设为50px，右上角和左下角设为10px */
{
border-radius: 50px 10px;
}
/* 将左上角设为10px，右上角和左下角设为20px，右下角设为30px */
{
border-radius: 10px 20px 30px;
}
/* 将左上角和右下角设为20px，右上角和左下角设为10px */
{
border-radius: 20px 10px;
}

可以使用负值来创建反向圆角。例如，如果想要元素的左上角和右下角变得尖锐，右上角和左下角变得圆形，则可以使用以下代码：

{
border-radius: 50% 0 0 -50%;
}

此外，border-radius也可以与其他属性一起使用，例如 box-shadow 和 background。例如：

{
border-radius: 10px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
background-color: #fff;
}

CSS圆角属性在现代Web开发中非常流行，可以用于创建各种复杂形状。它是Web设计师和开发人员的必备工具之一。