Die abgerundeten Ecken zeichnen sich direkt auf dem zugrunde liegenden SVG rx
und ry
Attribute, sie gelten für ganze Rechtecke und daher gibt es keine Möglichkeit, sie nur auf ein einzelnes zu setzen Ecke.
Dieser Blogbeitrag diskutiert einen Ansatz in SVG, bei dem man die Ecken, die man nicht abgerundet haben möchte, grundsätzlich verdeckt. Obwohl seine Beispiele jetzt offline zu sein scheinen, sollte der Ansatz relativ einfach in SVG rekonstruiert werden können.
Ein alternativer Ansatz wäre, einen Pfad anstelle eines Rechteckobjekts zu verwenden und den gesamten Umriss selbst zu zeichnen. Die Syntax ist ein wenig unklar, aber es ist einfach genug, wenn Sie erst einmal verstanden haben, was vor sich geht. Probieren Sie Jakob Jenkovs SVG-Pfad für eine Einführung.
Wenn Sie Raphael JS verwenden:
%Vor%Um ein Rechteck zu erhalten, bei dem nur die obere rechte Ecke abgerundet ist
%Vor%Quelle und Online-Beispiel: Ссылка
Sehr alte Frage, hier ist ein besserer Weg. Ich habe es in relative Koordinaten umgewandelt, was bei Animationen besser sein sollte ...
%Vor%Tags und Links javascript raphael