Podręcznik SVG

SVG oznacza skalowalne wektorowe grafiki (Scalable Vector Graphics)

SVG to XML format definiuje grafikę wektorową

przykłady w każdym rozdziale

Używając naszego edytora "spróbuj sam", możesz edytować SVG, a następnie kliknąć przycisk, aby zobaczyć wynik.

Przykłady SVG

<html>
<body>
<h1>Moje pierwsze SVG</h1>
<svg width="100" height="100">
  <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
</svg>
</body>
</html>

spróbuj sam

potrzebna wiedza podstawowa

przed kontynuowaniem nauki powinieneś mieć podstawową wiedzę na temat:

  • HTML
  • podstawowe XML

Jeśli chcesz nauczyć się tych treści najpierw, odwiedź związane z tym tutoriale na naszej stronie głównej.

co to jest SVG？

  • SVG oznacza skalowalne wektorowe grafiki
  • SVG do definiowania wektorowych grafik w sieci
  • SVG definiowanie grafiki w formacie XML
  • SVG każdy element i każda właściwość w pliku można animować
  • SVG jest rekomendacją W3C
  • SVG integracja z innymi standardami W3C, na przykład DOM i XSL

SVG jest rekomendacją W3C

SVG 1.0 stało się rekomendacją W3C 4 września 2001 roku.

SVG 1.1 stało się rekomendacją W3C 14 stycznia 2003 roku.

SVG 1.1 (drugie wydanie) stało się rekomendacją W3C 16 sierpnia 2011 roku.

SVG zalety

w porównaniu do innych formatów obrazów (np. JPEG i GIF), użycie SVG zalety:

  • SVG obraz można tworzyć i edytować za pomocą dowolnego edytora tekstu
  • SVG obraz można wyszukiwać, indeksować, skryptować i kompresować
  • SVG obraz jest rozszerzalny
  • SVG obraz można wydrukować w wysokiej jakości w każdej rozdzielczości
  • SVG obraz jest skalowalny
  • SVG grafika nie traci jakości przy skalowaniu lub zmianie rozmiaru
  • SVG jest otwartym standardem
  • SVG plik XML

tworzenie SVG obraz

SVG Obrazy można tworzyć za pomocą dowolnego edytora tekstu, ale lepiej używać programów graficznych (np. InkscapeTworzenie obrazów SVG zazwyczaj jest bardziej wygodne.