SVG Inline HTML5

HTML5 prend en charge l'inline SVG.

Qu'est-ce que SVG ?

  • SVG signifie Graphics Vectoriales Extensibles (Scalable Vector Graphics)
  • SVG est utilisé pour définir des graphiques vectoriels basés sur le réseau
  • Les images SVG sont définies en format XML
  • Les images SVG conservent leur qualité graphique lors de l'agrandissement ou du changement de taille
  • SVG est une norme du W3C

Avantages de SVG

Compared to other image formats (such as JPEG and GIF), the advantages of using SVG include :

  • Les images SVG peuvent être créées et modifiées avec un éditeur de texte
  • Les images SVG peuvent être recherchées, indexées, scriptées ou compressées
  • SVG est scalable
  • Les images SVG peuvent être imprimées en haute qualité à n'importe quelle résolution
  • Les images SVG peuvent être agrandies sans perte de qualité d'image

Support du navigateur

Internet Explorer 9, Firefox, Opera, Chrome et Safari supportent les SVG en ligne.

Intégrer directement SVG dans une page HTML

Dans HTML5, vous pouvez intégrer des éléments SVG directement dans une page HTML :

Exemple

<!DOCTYPE html>
<html>
<body>

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="190">
  <polygon points="100,10 40,180 190,60 10,60 160,180"
  style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;" />
</svg>

</body>
</html>

Essayer par vous-même

Résultat :

Tutoriel SVG

Pour en savoir plus sur SVG, veuillez visiter notre Tutoriel SVG.