SVGは、ベクター図形を表す際に使用します。
SVG(Scalable Vector Graphics)は、ベクター形式による図形です。 png、gif、jpegなどのラスター形式の画像が拡大縮小すると表示が荒くなるのに対して、 SVGはベクター形式の図形であるため、拡大縮小しても滑らかに描画されるのが特長です。
SVGをHTMLドキュメント中に表示するには、 png、gif、jpegなど形式の画像ファイルと同様に、 img要素のsrc属性の値として指定したり、 CSSで画像を利用するプロパティの値に指定するなどの方法で表示できます。
<p>
SVG画像とPNG画像です。
拡大縮小して違いをご確認ください。
</p>
<p>
<img src="sample/svg_star.svg" alt="SVG画像">
<img src="sample/svg_star.png" alt="PNG画像">
</p>
SVG画像とPNG画像です。 拡大縮小して違いをご確認ください。