SVG/Tutorials/Einstieg

Aus SELFHTML-Wiki
< SVG‎ | Tutorials
Wechseln zu: Navigation, Suche

SVG (engl. für: skalierbare Vektorgrafiken) ist eine Auszeichnungssprache für grafische Grundformen und Elemente, mit denen Sie Vektorgrafiken erstellen können, die viele Vorteile gegenüber Rastergrafiken haben.


Diese Tutorial-Reihe dient als Einstieg in SVG und ist als Rundgang angelegt. Während die ersten zwei Kapitel das Warum und Wie erklären, können Sie in den Kapiteln 3-6 Grafiken selbst erstellen und ausprobieren.



  1. Warum SVG nutzen?
    • Vorteile
    • SVG vs. Canvas
  2. SVG in Webseiten einbinden
    • Einbindung externer SVG-Dateien
    • Einbindung in CSS
    • inline-SVG in HTML
  3. Grundformen
    • Grundformen
    • Grupppierungen
    • Pfade
  4. Text
    • Füllungen und Randlinien
    • Verläufe
    • Animationen
  5. SVG mit CSS stylen
    • Präsentationsattribute
  6. SVG in responsiven Webseiten
    • viewBox



Siehe auch[Bearbeiten]


Einstieg in SVG