@namespace

概要

@namespace は、CSS スタイルシート で使用する XML 名前空間を定義する @-規則です。名前空間に含まれる要素のみ選択するよう、全称要素型属性の各セレクタを制限するために名前空間を使用できます。@namespace 規則は通常、複数の名前空間を含むドキュメント (インラインで SVG や MathML を含む HTML5 ドキュメントや、複数のボキャブラリが混在する XML ドキュメントなど) を扱う際に役立ちます。

スタイルシート内で @namespace 規則は、すべての @charset および @import 規則より後、また他の @-規則やスタイル宣言より前に配置しなければなりません。

@namespace は、スタイルシートの既定の名前空間を定義できます。既定の名前空間を定義するとすべての全称セレクタや要素型セレクタ (属性セレクタは除く。後述の注記を参照) は、既定の名前空間内の要素にのみ適用されます。

また、@namespace 規則で名前空間の接頭辞を定義できます。全称セレクタ、要素型セレクタ、属性セレクタに名前空間の接頭辞を付加すると、これらのセレクタは名前空間および要素または属性に一致する場合のみマッチします。

HTML5 では、既知の外来要素へ自動的に名前空間が割り当てられます。すなわち、HTML 要素はドキュメント内に xmlns 属性が存在しなくても XHTML 名前空間 (http://www.w3.org/1999/xhtml) に含まれているかのように動作します。また <svg> および <math> 要素は、適切な名前空間 (http://www.w3.org/2000/svg および http://www.w3.org/1998/Math/MathML) が割り当てられます。

注記: XML では、属性に直接接頭辞を定義しない限り (: xlink:href)、属性は名前空間を持ちません。言い換えると、属性は所属する要素から名前空間を継承しません。この動作に合わせるため、CSS の既定の名前空間は属性セレクタに適用しません。

構文

/* 既定の名前空間 */
@namespace url(XML-namespace-URL);
@namespace "XML-namespace-URL";

/* 接頭辞つき名前空間 */
@namespace prefix url(XML-namespace-URL);
@namespace prefix "XML-namespace-URL";

形式文法

@namespace <namespace-prefix>? [ <string> | <uri> ];

where
<namespace-prefix> = IDENT

@namespace url(http://www.w3.org/1999/xhtml);
@namespace svg url(http://www.w3.org/2000/svg);

/* XHTML が既定の接頭辞なし名前空間であるため、これはすべての XHTML <a> 要素にマッチする */
a {}

/* これはすべての SVG <a> 要素にマッチする */
svg|a {}

/* これは XHTML および SVG の <a> 要素にマッチする */
*|a {}

仕様

仕様書 策定状況 コメント
CSS Namespaces Module
@namespace の定義
勧告 最初期の定義

ブラウザ実装状況

機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari
基本サポート 1.0 1.0 (1.7 or earlier) 9.0 8.0 1.0
名前空間セレクタ (|) 1.0 1.0 (1.7 or earlier) 9.0 8.0 3.0
機能 Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
基本サポート ? ? ? ? ? ?

ドキュメントのタグと貢献者

 このページの貢献者: yyss
 最終更新者: yyss,