CSS klips yolu kullanırken köşeler nasıl yuvarlanır

Question

Oluşturduğum bu şekildeki en soldaki 3 köşeyi yuvarlamak istiyorum, bunun nasıl yapılabileceği hakkında bir fikriniz var mı? yuvarlamak

div{ 
 
    position: absolute; 
 
    z-index: 1; 
 
    width: 423px; 
 
    height: 90px; 
 
    background-color: #b0102d; 
 
    color: white; 
 
    right: 0; 
 
    margin-top: 10vw; 
 
    -webkit-clip-path: polygon(100% 0%, 100% 50%, 100% 100%, 25% 100%, 0% 50%, 25% 0%); 
 
clip-path: polygon(100% 0%, 100% 50%, 100% 100%, 25% 100%, 0% 50%, 25% 0%); 
 
}

<div></div>

Answer 1

evet Yorum seçeneği yok, bu yüzden cevap olarak yazıyorum ..

Eğer mümkün olduğunca çok puan yazmaya gerek köşe. Nothig başka ... örneğin, bir kaç daha fazla puan alt kısmı biraz yuvarlak yapmak için: Buraya comment insanlar olarak

-webkit-clip-path: polygon(100% 0%, 100% 100%, 100% 100%, 25% 100%, 5% 70%,1% 60%, 0% 50%, 25% 0%); 

evet, oh, ya SVG .. :)

Answer 2

Arkanı karışıklık da yapabilirsiniz bazı efektler almak için daire ile.

Codepen

Eğer poligon ve daire birleştiremezsiniz ... veya belki de can ve bunu anlamaya yeterli onunla etrafında oynamadım Çok kötü

-webkit-clip-path: circle(60.0% at 50% 10%); 
clip-path: circle(50.0% at 50% 50%); 

. HTH

Answer 3

Dikdörtgen bir klips oluşturun ve üzerinde yuvarlak kenarlık bulunan kalın bir dikdörtgen yerleştirin. İyi şanslar!