椭圆的实现主要依靠 border-radius 属性,该属性确定边框切圆角的半径大小,可以指定数值 px,也可以使用百分比显示
而且该属性非常灵活,四个角可以分别设置
width: 200px;
height:200px;
//正方形
--------------------------------------------------------
border-radius:100px;
//圆形
border-radius:50%/50%;
//水平半径 / 垂直半径
--------------------------------------------------------
border-radius:50px/20px; //椭圆边角
--------------------------------------------------------
border-radius:50%/100% 100% 0 0 //半椭圆,底部垂直圆角为0时水平圆角也自动为0,无需再次指定