[html 5]学習ノート-SVG

3558 ワード

1、SVG紹介:SVGとは何ですか.
1)SVGは伸縮ベクトルパターン(Scalable Vector Graphics)を指す
2)SVGは、ネットワークのためのベクトルベースのパターンを定義する
3)SVGはXML形式で図形を定義する
4)SVGパターンは、サイズを拡大または変更した場合、そのパターン品質が損なわれない
5)SVGはウェブ連盟の標準である
SVGの強みは?
1)SVG画像はテキストエディタによって作成、修正できる
2)SVG画像を検索、インデックス、スクリプト化、圧縮することができる
3)SVGは伸縮可能
4)SVG画像は任意の解像度で高品質に印刷できる
5)SVGは、画像品質が低下することなく拡大することができる
 
2、SVGはベクトル図形を描く
 1 <!DOCTYPE html>
 2 <html>
 3 <head lang="en">
 4     <meta charset="utf-8">
 5     <title></title>
 6 </head>
 7 <body>
 8     <svg width="120" height="120" viewBox="0 0 120 120" version = "1.1">
 9         <circle cx = "60" cy = "50" r="50"></circle>
10     </svg>
11 </body>
12 </html>

 
 
3、外部SVGファイルの導入
(補足対象)