Wellen in CSS oder SVG

8

Ich versuche mit CSS weiche Wellen zu erzeugen und habe Probleme. Ich benutze jetzt border-radius, um Wellen zu erzeugen, aber es sieht eher wie Wolken aus. Ich habe versucht, transform: translateZ(180deg); , aber die div Farbe ist dann auf den Kopf gestellt.

Folgendes möchte ich:

Folgendes habe ich:

%Vor% %Vor%
    
TheFlyingProgrammer 21.06.2017, 02:40
quelle

1 Antwort

9

Ich würde vorschlagen, ein inline handcodiertes SVG zu verwenden. Deine Formen sind ziemlich einfach und ein macht die Wellen mit dem Element SVG <path> einfach Alles, was Sie über den Pfad SVG auf MDN wissen müssen . Im folgenden Beispiel habe ich zwei Pfadelemente mit quadratischen Bezier-Kurven verwendet um die Wellen zu machen:

%Vor% %Vor%
    
web-tiki 22.06.2017, 12:13
quelle

Tags und Links