<svg>

Cette traduction est incomplète. Aidez à traduire cet article depuis l'anglais.

L'élément svg peut être utilisé pour intégrer des fragment de code SVG à l'intérieur d'un document (par exemple, un document HTML). Ce fragment de code SVG dispose de son propre viewport et son propre système de coordonnée.

Contexte d'utilisation

CatégoriesÉlément conteneur, Élément structurel
Contenu autoriséTout élément de cette liste, quel qu'en soit l'ordre:
Éléments d'animation
Éléments descriptifs
Éléments de formes
Éléments structurels
Eléments de dégradés
<a>, <altGlyphDef>, <clipPath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignObject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view>

Exemple

Etant donné le fichier SVG suivant (représentant le drapeau nationnal de l'Italie) :

<svg xmlns="http://www.w3.org/2000/svg" 
     width="150" height="100" viewBox="0 0 3 2">

  <rect width="1" height="2" x="0" fill="#008d46" />
  <rect width="1" height="2" x="1" fill="#ffffff" />
  <rect width="1" height="2" x="2" fill="#d2232c" />
</svg>

Ce fichier peut être inclu dans un document HTML5 de cette façon :

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8" />
  <title>Exemple mêlant HTML & SVG</title>
</head>

<body>

  <svg width="150" height="100" viewBox="0 0 3 2">
    <rect width="1" height="2" x="0" fill="#008d46" />
    <rect width="1" height="2" x="1" fill="#ffffff" />
    <rect width="1" height="2" x="2" fill="#d2232c" />
  </svg>

</body>
</html>

Attributs

Attributs globaux

Attributs spécifiques

Interface DOM

Cette élément implémente l'interface SVGSVGElement.

Spécifications

Spécification Status Commentaires
Scalable Vector Graphics (SVG) 2
La définition de '<svg>' dans cette spécification.
Candidat au statut de recommandation  
Scalable Vector Graphics (SVG) 1.1 (Second Edition)
La définition de '<svg>' dans cette spécification.
Recommendation Définition initiale

Compatibilité des navigateurs

Feature Chrome Firefox (Gecko) IE Opera Safari
Support basique 1.0 1.5 (1.8) 9.0 8.0 3.0.4
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Support basique 3.0 1.0 (1.8) Pas de support (Oui) 3.0.4

Ce tableau est basé d'après ces sources de thèses.

Étiquettes et contributeurs liés au document

 Contributeurs à cette page : khalyomede
 Dernière mise à jour par : khalyomede,