css3-绘制椭圆形

xyc

    上次刚说过css绘制三角形，今天来说一下绘制椭圆形的样式。
    椭圆形：实现原理-圆形的变体，高度设置为宽度的一半，border-radius属性为高度除以高度一半。
    效果图：
   
  HTML代码：
  

[HTML] 纯文本查看 复制代码

<div class="div"></div>

  css样式：
   

[CSS] 纯文本查看 复制代码

     .div {
             width: 200px;
             height: 100px;
             float: left;
             background: #8e00ff;
             -webkit-border-radius: 100px / 50px;
             -moz-border-radius: 100px / 50px;
             border-radius: 100px / 50px;
           }

以上就是实现椭圆形的效果，后面会继续给大家说说css实现其他图形的样式方法。希望大家多多关注！

范范

支持下