Supporté par ChromeSupporté par FirefoxSupporté par EdgeSupporté par Safari/iOS <svg> : Démo HTML5

Mise à jour : 2017-01-22

Scalable Vector Graphics est désormais intégré directement dans le code HTML5.

<svg>

application/xhtml+xml

Notes sur le tuto


Exemple de code HTML5

&lt;img&gt; :
<img src="img/Svg_logo_basic_red_100x100.svg" alt="Logo SVG"><br>
<br>
&lt;svg&gt; :<br>
<iframe src="_svg.xhtml"></iframe>
<!--_svg.xhtml
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta charset="UTF-8"/>
	<title></title>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" width="440" height="120">
	<rect x="20" y="20" rx="20" ry="20" width="400" height="80"
		fill="green" stroke="lightgreen" stroke-width="5"/>
	<text x="40" y="60">
		Si ce texte est dans une boite verte, &lt;svg&gt; est supportee !
	</text>
</svg>
</body>
</html>-->

Démonstration du résultat HTML5


<img> : Logo SVG

<svg> :

Détection automatique du support HTML5

Librairie JavaScript de détection automatique (attention, comporte quelques faux positifs et faux négatifs)
<script src="_html5detect.js"></script>
<script>isItemSupported("window.SVGSVGElement")</script>		

Can I Use svg? Data on support for the svg feature across the major browsers from caniuse.com.