.png Icon durch .svg ersetzen

[Gunnar Bittersmann]

@@Tabellenkalk

Z.B. ein

<circle cx="80" cy="80" r="60" fill="yellow" />

vor dem <g?

Dann kann man es aber auch gleich richtig machen und den circle nicht nur für die gelb gefüllte Fläche nehmen, sondern auch für die graue Kreislinie:

<circle cx="80" cy="80" r="60" stroke="#4b4b4b" stroke-width="10" fill="yellow"/>

und das erste path-Element entsorgen, was den Kreis aus unzähligen Stückchen zusammensetzt. (Sowas kommt halt aus Zeichenprogrammen wie Illustrator raus.)

☞ Codepen

Und wenn wir schon dabei sind, machen wir den i-Punkt auch noch als circle und schmeißen auch das zweite path-Element weg. Ja, das mit transform="matrix(…)". (Sowas kommt halt aus Zeichenprogrammen wie Illustrator raus.)

☞ Codepen 2

Anmerkung: SVG sollten i.d.R. nicht width- und height-Attribute haben, sondern viewBox.

😷 LLAP