1.border-radius可以同时设置1到4个值。简洁法

如果设置1个值，表示4个圆角都使用这个值。

border-radius:40px;

如果设置两个值，表示左上角和右下角使用第一个值，右上角和左下角使用第二个值。

border-radius: 10px 50px;

如果设置三个值，表示左上角使用第一个值，右上角和左下角使用第二个值，右下角使用第三个值。

border-radius: 10px 50px 40px;

如果设置四个值，则依次对应左上角、右上角、右下角、左下角(顺时针顺序)。

border-radius: 10px 20px 30px 40px;

2.单独设置一个角的写法

border-top-left-radius: 20px; //设置左上角

border-top-right-radius: 20px; //设置右上角

border-bottom-left-radius: 20px; //设置左下角

border-bottom-right-radius: 20px; //设置左下角

3.CSS画实心圆(宽度和高度保持一致，并且设置border-radius:50%)

代码:

.circle{undefined

width: 150px;/*宽高保持一致*/

height: 150px;

line-height: 150px; /*当高度与行高保持一致时为垂直居中*/

border-radius: 50%;

background: orange;

margin: 50px;

text-align: center;

color: #fff;

}

圆形