Tutorial SVG

SVG si riferisce ai grafici vettoriali scalabili (Scalable Vector Graphics)

SVG definire XML definire grafici basati su vettori.

esempi in ogni capitolo

Utilizzando il nostro editor "prova personalmente", puoi modificare l'SVG e poi fare clic sul pulsante per vedere i risultati.

Esempio SVG

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

prova personalmente

conoscenze di base necessarie

prima di continuare, dovresti avere una conoscenza di base di quanto segue:

  • HTML
  • di base XML

Se desideri imparare questi contenuti per primi, visita i tutorial correlati sulla nostra homepage.

cos'è SVG？

  • SVG si riferisce ai grafici vettoriali scalabili (Scalable Vector Graphics)
  • SVG usato per definire grafici web vettoriali
  • SVG definire grafici in formato XML
  • SVG ogni elemento e ogni attributo nel file può essere animato
  • SVG è uno standard raccomandato del W3C
  • SVG è integrato con altri standard W3C, ad esempio DOM e XSL

SVG è uno standard raccomandato del W3C

SVG 1.0 è diventato lo standard raccomandato del W3C il 4 settembre 2001.

SVG 1.1 è diventato lo standard raccomandato del W3C il 14 gennaio 2003.

SVG 1.1 (seconda versione) è diventato lo standard raccomandato del W3C il 16 agosto 2011.

SVG i vantaggi

confrontati con altri formati di immagini (come JPEG e GIF), l'uso di SVG i vantaggi sono:

  • SVG le immagini possono essere create e modificate utilizzando qualsiasi editor di testo
  • SVG le immagini possono essere cercate, indicizzate, scriptate e compressate
  • SVG le immagini sono estensibili
  • SVG le immagini possono essere stampate in alta risoluzione in qualsiasi risoluzione
  • SVG le immagini sono scalabili
  • SVG le immagini grafiche non perdono qualità quando vengono ingrandite o ridotte
  • SVG è un standard aperto
  • SVG un file XML è un file puro XML

creare SVG immagine

SVG Le immagini possono essere create utilizzando qualsiasi editor di testo, ma è meglio usarne uno di disegno (ad esempio InkscapeCreare un'immagine SVG di solito è più conveniente.