「SVG」の版間の差分
削除された内容 追加された内容
textタグは、titleなどの編集上の情報提供とは異なるので、節を分離。textタグは実際に画面に文字表示するので、目的が違う。 |
|||
281 行
なお、閉じていない単なる折れ線を描画したい場合には、polygon 要素ではなく path 要素を使います。
== 関連情報の記述方法 ==▼
SVGでは下記のように、タイトルなどの付加情報を記述することもできます。▼
記述の位置はどこでも可能ですが、一般的には、svg開始タグの直後に記載するのが慣例です。▼
<syntaxhighlight lang="xml">▼
<svg>▼
<title> 題名 </title>▼
<desc> 解説 </desc>▼
<rect x="150" y="80" width="100" height="50" ▼
fill="lightblue" stroke="black" stroke-width=" 5" />▼
</svg>▼
</syntaxhighlight>▼
title や desc は省略も可能です。▼
=== 説明 ===▼
'''desc'''要素で表します。▼
=== タイトル===▼
'''title'''要素で、タイトルを表します。▼
HTMLファイルに組み込んだ場合、規格の想定などではブラウザなどでtitleの内容を表示する予定なのかもしれないのですが、しかし現状2020年の時点では、FirefoxでもGoogle Chromeでもブラウザではsvgタグ内部のtitleタグの内容は表示されません。（HTMLタグのtitleとは、仕様の実装が違っています。）▼
また、拡張子を.svgに変えてもInkscapeで調べても同様に、titleタグの内容ではなくファイル名そのものがInkscapeのファイル名に表示されます。▼
▲=== 文章 ===
HTMLでwebページを作るだけなら不要ですが、規格上は<code><nowiki><text></nowiki></code>タグで囲むことによりSVGファイルでも文字列を表示させる事ができます。
HTMLとは違い、textタグでは座標の位置を指定して文字列を表示できます。
339 ⟶ 312行目:
</svg>
</syntaxhighlight>
▲== 関連情報の記述方法 ==
▲SVGでは下記のように、タイトルなどの付加情報を記述することもできます。
▲記述の位置はどこでも可能ですが、一般的には、svg開始タグの直後に記載するのが慣例です。
▲<syntaxhighlight lang="xml">
▲<svg>
▲ <title> 題名 </title>
▲ <desc> 解説 </desc>
▲ <rect x="150" y="80" width="100" height="50"
▲ fill="lightblue" stroke="black" stroke-width=" 5" />
▲</svg>
▲</syntaxhighlight>
▲title や desc は省略も可能です。
▲=== 説明 ===
▲'''desc'''要素で表します。
▲=== タイトル===
▲'''title'''要素で、タイトルを表します。
▲HTMLファイルに組み込んだ場合、規格の想定などではブラウザなどでtitleの内容を表示する予定なのかもしれないのですが、しかし現状2020年の時点では、FirefoxでもGoogle Chromeでもブラウザではsvgタグ内部のtitleタグの内容は表示されません。（HTMLタグのtitleとは、仕様の実装が違っています。）
▲また、拡張子を.svgに変えてもInkscapeで調べても同様に、titleタグの内容ではなくファイル名そのものがInkscapeのファイル名に表示されます。
=== 非表示タグ ===
| |||