このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

SVG 属性リファレンス

SVG 要素は、その要素の処理や描画方法を変更する属性を使用して変更することができます。

以下は、すべての SVG 属性のリストです。各属性のリンク先のドキュメントでは、どの要素が属性に対応しているか、どのように動作するかを学ぶことができます。

SVG 属性 A to Z

A

B

C

D

E

F

G

H

I

K

L

M

N

O

P

R

S

T

U

V

W

X

Y

Z

カテゴリー別の SVG 属性

コア属性

コア属性はグローバル属性です。

条件処理属性

条件付き処理属性は、それらが設定された要素が処理されるかどうかを制御します。

XLink 属性は、リソースを参照することができます。

プレゼンテーション属性

SVG のプレゼンテーション属性とは、SVG 要素に対して CSS プロパティとしても使用できる SVG 属性のことです。 これらは、詳細度 0 で要素に CSS プロパティの値を設定するため、スタイルシート内の他の作成者スタイルや style 属性によって上書きされる可能性があります。 プレゼンテーション属性の値は、宣言ではなく CSS 値として構文解析されるため、!important を含めることはできません。

ほとんどのプレゼンテーション属性は、CSS プロパティとして使用された場合、継承されます(例えば fill や stroke)。 幾何プロパティが主な例外です。これらに対応する CSS プロパティは継承されません。

幾何プロパティ

幾何プロパティは、SVG 図形の位置やサイズを記述します。 SVG 2 において、これらはプレゼンテーション属性の定義されたサブセットであり、対応する CSS プロパティは継承されません。

それぞれの幾何プロパティは、特定の要素に対してのみプレゼンテーション属性として適用されます。 例えば、r は <circle> の半径を定義しますが、<rect> などの要素には効果がありません。

SVG の幾何プロパティは以下の通りです。

要素ごとの適用性については、それぞれのプロパティの属性ページおよび <g> 要素ページの一覧を参照してください。

フィルター属性

フィルタープリミティブ属性(プレゼンテーション属性)

height, result, width, x, y

座標変換関数属性

type, tableValues, slope, intercept, amplitude, exponent, offset

アニメーション属性

アニメーション対象要素属性
href
アニメーション属性に対する属性

attributeType, attributeName

アニメーションタイミング属性

begin, dur, end, min, max, restart, repeatCount, repeatDur, fill

アニメーション値属性

calcMode, values, keyTimes, keySplines, from, to, by

アニメーション付加属性

additive, accumulate

イベント属性

HTML および SVG のすべての要素は、GlobalEventHandlers ミックスインで定義されたイベントハンドラー属性に対応しています。

イベントハンドラー属性(onblur や onauxclick など)はすべての要素に適用されますが、効果がない場合があります。たとえば、oncuechange 属性は任意の要素に適用できますが、<track> 要素にのみ関連します。

イベントハンドラー属性は推奨されず、安全でないと見なされ、コンテンツセキュリティポリシー (CSP) によってブロックされる可能性があります。代わりに、addEventListener() メソッド内でイベント名を使用してください。

関連情報