background:radial-gradient(200px at right top,transparent 50%,blue 50%);
}
/* 右下 */
.raidal3 {
height:100px;
width:100px;
background:radial-gradient(200px at right bottom,transparent 50%,blue 50%);
}
/* 左下 */
.raidal4 {
height:100px;
width:100px;
background:radial-gradient(200px at left bottom,transparent 50%,blue 50%);
}
<div class='raidal1'></div>
<div class='raidal2'></div>
<div class='raidal3'></div>
<div class='raidal4'></div>
8. 同样,不想这么圆角,也是可以椭圆的,半径设两个参数, 就是椭圆。
/* 左上 */
.ellipse {
height:100px;
width:100px;
background:radial-gradient(200px 300px at left top,transparent 50%,blue 50%);
}
<div class='ellipse'></div>径向渐变有很多参数大家可以自己再尝试调整,可以出现各种奇怪的形状,这里就不演示了。相对来说,内凹圆角就够用了










