@namespace

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

@namespace 是一個 at-rule，它決定要在 CSS 樣式表中要使用的 XML 命名空間。

語法

css

/* 默認的命名空間 */
@namespace url(XML-namespace-URL);
@namespace "XML-namespace-URL";
/* 有前綴的命名空間 */
@namespace prefix url(XML-namespace-URL);
@namespace prefix "XML-namespace-URL";

說明

@namespace 可以用来限制樣式的選擇器（包含通用的、元素選擇器和屬性選擇器）僅套用於指定的命名空間。@namespace 通常在處理有多個命名空間的檔案時很有用——例如有內嵌 SVG 或 MathML 的 HTML、混和多個命名空間的 XML 等。

@namespace 必须放在 @charset 和 @import 規則之後，在其他 at-rule 及 Style Declaration 之前。

@namespace 可以用來定義默認命名空間或是有前綴的命名空間的樣式。所有在指定命名空間下的通用、元素選擇器都會套用該樣式，屬性選擇器則只適用於「有前綴的命名空間」（詳見下方註釋）。

在 HTML5，已知的外部元素會自動為其分配命名空間。舉例來說，即使沒有設置 xmlns 屬性，所有的 HTML 元素都會自動視為 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），該屬性就不會繼承元素的命名空間（亦即 link的命名空間可能是 http://www.w3.org/1999/xhtml 而不是 http://www.w3.org/2000/svg）。因此，CSS 的「默認的命名空間」並不適用於屬性

形式語法

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

<namespace-prefix> = 
  <ident>  

<url> = 
  <url()>  |
  <src()>  

<url()> = 
  url( <string> <url-modifier>* )  |
  <url-token>                      

<src()> = 
  src( <string> <url-modifier>* )

範例

指定默認及前缀的命名空間

css

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

/* 在文檔裡面所有使用 XHTML 命名空間的 <a> 元素都會套用以下樣式 */
a {
}

/* 以下則是會套用所有「命名空間為 http://www.w3.org/2000/svg 的 svg」底下的所有 <a> 元素 */
svg|a {
}

/* 無論是 XHTML 還是 SVG 的 <a> 元素都會套用以下樣式 */
*|a {
}

瀏覽器相容性

BCD tables only load in the browser

參見

命名空間速成班