試してみてください - それを自分の例
例としては、以下のHTMLコードに直接SVGコードを埋め込みます。
これは、Firefox、Internet Explorer 9の、Google Chromeは、オペラ、およびSafariでサポートされています。
SVG例
SVG基本図形
サークル
長方形
不透明度の長方形
不透明度2の長方形
角の丸い四角形
楕円
互いの上に3つの楕円
2つの楕円
ライン
三辺を持つ多角形
4辺を持つ多角形
星
別の星
ポリライン
別のポリライン
通り
2次ベジエ曲線
テキストを書きます
テキストを回転
数行のテキスト
リンクとしてのテキスト
ライン、テキストや輪郭線の色を定義し(stroke)
ライン、テキストや輪郭線の幅を定義します(stroke-width)
オープンパスに語尾の異なるタイプを定義します(stroke-linecap)
破線の定義の線(stroke-dasharray)
SVGフィルター
feGaussianBlur -ぼかし効果
feOffset -その後、オフセット画像の上に原稿をブレンドし、矩形をオフセット
feOffset -オフセット画像をぼかします
feOffset -影の黒を作ります
feOffset -色として影を扱います
feBlendフィルタ
フィルタ1
フィルタ2
フィルタ3
フィルタ4
フィルタ5
フィルタ6
SVGグラデーション
黄色から赤色への水平方向の直線勾配の楕円
黄色から赤色への垂直方向の直線勾配の楕円
黄色から赤色への水平方向の直線勾配、およびテキストの楕円
白から青に放射状グラデーションの楕円
白から青に放射状のグラデーションを持つ別の楕円
SVGその他
繰り返し5秒かけて消えていくのRectangle
色を変更します成長の長方形
色が変わりますスリー長方形
モーションパスに沿ってテキストを移動
モーションパスに沿って、移動、回転、およびスケールのテキスト
、移動、回転、およびスケールのモーションパスに沿ってテキスト+色が変わります成長の長方形
楕円を回転させます