如何在css3中制作此橢圓形

Question

width: 100%;
    height: 200px;
    background: #5e2424;
    -moz-border-radius: 100px / 50px;
    -webkit-border-radius: 100px / 178px;
    border-radius: 694px 208px 0px 0px;
    z-index: 100;
    position: relative;
    top: -199px;
}

如何使該橢圓像圖像中一樣？

Answer 1

使用偽元素

 div { position: relative; width: 556px; height: 363px; background: url(https://i.stack.imgur.com/gHNBX.png); background: cover; overflow: hidden; } div::after { content: ''; position: absolute; top: 165px; left: -45%; width: 180%; height: 200%; background: rgba(255,0,0,0.7); border-radius: 50%; } 

 <div></div>