使用border-radius绘制椭圆

border-radius总共接受8个值,前4个为水平方向上的值,后4个为垂直方向;spa

border-radius: 50px 50px 50px 50px/25px 25px 25px 25px;

水平方向和垂直方向上的4个值顺序都是左上,右上,右下,左下。code

以水平方向为例(能够经过审查元素查看样式):blog

设置第一个值为10px,其余50px:class

 

当水平方向的都为25px,垂直为50px时:样式

 

只需将宽度改成50px:margin

 

 

若是想绘制水平的椭圆: di

 

在绘制水平椭圆时使用了简写的方式border-radius: 50px/25px;简写的写法相似padding和marginco

相关文章
相关标签/搜索