css圆角效果 选中 |css display几种

/* 圆角大小为50%时，元素呈现圆形 */
border-radius: 50%;
/* 只设置两个角为圆角，分别是左上角和右下角 */
border-top-left-radius: 10px;
border-bottom-right-radius: 10px;
/* 设置四个角上下左右的圆角大小 */
border-radius: 10px 20px 30px 40px;

以上是一些基础的圆角实现方式，接下来介绍一些高级的实现方式。

/* 可以设置多个圆角大小，每个圆角之间用“/”隔开 */
border-radius: 10px 20px 30px 40px / 50px 60px 70px 80px;
/* 可以设置椭圆形的圆角 */
border-radius: 50% / 20% 30%;
/* 针对网页中的图片元素设置圆角 */
img {
border-radius: 50%;
display: block;
margin: auto;
}

通过上述的方法，大家可以轻松地实现各种形状的圆角效果，不同的圆角效果也可以根据需求来选择不同的实现方式。