@namespace

概述

@namespace 是一条 @规则 ，用来定义使用在 CSS 样式表 中的 XML命名空间 。定义好的命名空间可以用来限定  通配、 元素（类型）、 和 属性选择器 只选择指定命名空间里的元素. @namespace 规则通常只当处理多个命名空间时很有用——例如HTML5里面包含SVG 或 MathML、或者XML that mixes multiple vocabularies.

任何 @namespace 规则都必须在所有的 @charset 和 @import 规则之后, 并且在样式表中，位于其他任何 style declarations 之前。

@namespace 可以用来定义默认命名空间。当定义过默认命名空间后, 所有的通配选择器和类型选择器（但不包括属性选择器，详情看下面的note）都只应用在这个命名空间的元素中。

@namespace 规则也可以用于定义命名空间前缀。当一个通配、类型、属性选择器前面有命名空间前缀修饰时，这个选择器将只匹配那些命名空间与 元素名或属性匹配 的元素。

在 HTML5 中，已知的 foreign elements(“外语元素，比如SVG和math命名空间中的元素”)将被自动加上命名空间。这意味着即使文档中没有任何xmlns属性，HTML元素也将表现的如同他们在XHTML命名空间内 (https://www.w3.org/1999/xhtml)一样，而 <svg> 和 <math> 元素则将被加上对应的命名空间 (https://www.w3.org/2000/svg 和https://www.w3.org/1998/Math/MathML).

语法

/* 默认命名空间 */
@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(https://www.w3.org/1999/xhtml);
@namespace svg url(https://www.w3.org/2000/svg);

/* 匹配所有的XHTML <a> 元素, 因为 XHTML 是默认无前缀命名空间 */
a {}

/* 匹配所有的 SVG <a> 元素 */
svg|a {}

/* 匹配 XHTML 和 SVG <a> 元素 */
*|a {}

规范

浏览器兼容性