如何使div角椭圆形？

Question

使用css我希望div部分的角部呈椭圆形。

.c {
height: 10em;
background: radial-gradient(circle 50px at 50% 100%, transparent 50px, rgba(84, 82, 94, 0.8) 50px);
background: -webkit-radial-gradient(50% 100%, circle, transparent 50px, rgba(84, 82, 94, 0.8) 50px);
}

Answer 1

您可以使用以下代码来赋予div的椭圆形状： -

.myclass{border:1px;
-moz-border-radius:4px 4px 4px 4px;   
-khtml-border-radius:4px 4px 4px 4px;
-webkit-border-radius: 4px 4px 4px 4px;
border-radius:14px 14px 14px 14px;
}

你可以通过增加和减少四个角的值来调整椭圆的角度 border-radius：25px 25px 14px 14px; 等

Answer 2

很简单

#oval {
    width: 200px;
    height: 100px;
    background: red;
    -moz-border-radius: 100px / 50px;
    -webkit-border-radius: 100px / 50px;
    border-radius: 100px / 50px;
}

-moz-border-radius: 100px / 50px;支持以前版本的firefox。 -webkit-border-radius: 100px / 50px;支持以前版本的Chrome。