如何给一个椭圆形的形状？ [英] How to give a div oval shape?

问题描述

我尝试了很多椭圆形，两侧都剪了，但不能做到

我需要椭圆形的代码，两侧都有剪切。

： -

  .demo {
 width：100％; 
 height：600px; 
 background：white; 
 -moz-border-radius：100px / 50px; 
 -webkit-border-radius：100px / 178px; 
 border-radius：694px / 208px; 
 
 z-index：100; 
 position：relative;这是正常的吗？

p>

HTML

 < div id = oval_parent> 
< div id =oval>< / div> 
< / div> 
  

CSS

  #oval_parent {
 background：black; 
 width：200px; 
 height：120px; 
 overflow：hidden; 
} 
 
 #oval {
 width：220px; 
 height：100px; 
 margin：10px 0 0 -10px; 
 background：white; 
 -moz-border-radius：100px / 50px; 
 -webkit-border-radius：100px / 50px; 
 border-radius：100px / 50px; 
} 
  

DEMO 。

I tried a lot on oval shape which have cut in both sides but not able to do it please

I need code for oval shape with cut in both side..

Here's my code below:-

.demo{
    width: 100%;
    height: 600px;
    background: white;
    -moz-border-radius: 100px / 50px;
    -webkit-border-radius: 100px / 178px;
    border-radius: 694px / 208px;

    z-index: 100;
    position: relative;
    }

解决方案

Is this OK ?

HTML

<div id="oval_parent">
    <div id="oval"></div>
</div>

CSS

#oval_parent{
    background:black;
    width:200px;
    height:120px;
    overflow:hidden;
}

#oval{
    width: 220px;
    height: 100px;
    margin:10px 0 0 -10px;  
    background: white;
    -moz-border-radius: 100px / 50px;
    -webkit-border-radius: 100px / 50px;
    border-radius: 100px / 50px;
}

DEMO.

这篇关于如何给一个椭圆形的形状？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！