CSS - @namespace

@namespace 是一个用于指定要在 CSS 样式表中使用的 XML 命名空间的@规则。

XML 命名空间是通过@namespace规则创建的，并用于 CSS 样式表。
在具有多个命名空间的文档中，例如与内联 SVG 或 MathML 配合使用的 HTML，或混合的 XML 词汇表，这些命名空间可能会将选择限制在该命名空间内的特定项目。
使用@namespace宏进行的命名空间声明必须出现在样式表中其他 @规则和样式声明之前，并且必须遵守@charset和@import规则。
可以使用@namespace设置样式表的默认命名空间。使用默认命名空间时，通用选择器和类型选择器（属性选择器除外）仅适用于该命名空间内的项目。
还可以使用@namespace规则定义命名空间前缀。当命名空间前缀添加到通用、类型或属性选择器时，只有当元素或属性的命名空间和名称匹配时，选择才会匹配。
在 HTML 中，会自动为识别的外部组件提供命名空间。因此，即使页面没有任何 xmlns 属性的实例。
HTML 组件的行为就像它们位于 XHTML 命名空间中一样，并且 svg 和 math 元素将获得其相应的命名空间。

示例

以下示例演示了@namespace的使用。

<html>
<head>
<style>
    @namespace svg url('http://www.w3.org/2000/svg');
    body {
        font-family: Arial, sans-serif;
        background-color: #f0f0f0;
    }
    .html-link {
        color: green;
        text-decoration: underline;
        font-weight: bold;
    }
    svg|a {
        fill: navy;
        text-decoration: underline;
        font-weight: bold;
    }
</style>
</head>
<body>
<p><a href="#" class="html-link">This is a regular HTML link</a></p>
<svg width="250px" viewBox="0 0 250 20" xmlns="http://www.w3.org/2000/svg">
    <a href="#">
        <text x="0" y="15">This is a link created in SVG</text>
    </a>
</svg>
</body>
</html>

打印页面