在CSS中@namespace的用途是什么？ [英] What is the use of @namespace in CSS?

问题描述

从 doc ，我发现使用了如下所示的命名空间：

From the doc, I found the use of namespace like below:

@namespace foo url(http://www.example.com);
 foo|h1 { color: blue } 

但我想了解更多。为什么我们使用它？

But I want to know more about this. Why do we use it?

推荐答案

在你给出的例子中， color：blue 规则将限制为 foo 命名空间中的 h1 元素（由 url（example.com））。

In your given example, the color: blue rule will be limited to only h1 elements in the foo namespace (linked by url(example.com)).

据我所知，这被认为不常需要。它当然看起来很奇怪。

To my knowledge, it's regarded as not often needed. And it certainly looks weird.

这是一个很好的应用程序摘要： http://nimbupani.com/spacing-out-on-css-namespaces.html

Here's a nice summary of its application: http://nimbupani.com/spacing-out-on-css-namespaces.html

只有它定义的是如何在CSS中声明一个 XML命名空间前缀。如果你想使用只匹配某个命名空间中的元素的选择器，那么这是必需的。

The only thing it defines is how to declare an XML namespace prefix in CSS. That is needed if you want to use selectors that only match elements in a certain namespace.

例如，SVG共享一些常见元素（例如 ; a> ）和具有XML和HTML的HTML的CSS属性。如果对HTML和SVG文档使用相同的样式表，则最好分离SVG和HTML的样式以防止任何重叠。 ...

For example, SVG shares some common elements (e.g. <a>) and CSS properties with HTML with XML and HTML. If you are using the same stylesheet for both HTML and SVG documents, then it is best to separate out the styles for SVG and HTML to prevent any overlap. …

这是一个很好的分步细目：

Here's a nice step-by-step breakdown of its parts:

@namespace 声明默认命名空间并将命名空间绑定到命名空间前缀。默认名称空间应用于没有显式名称空间组件的名称。 ...如果您声明具有前缀的 @namespace 规则，则可以使用命名空间限定名称中的前缀。 ...

@namespace declares the default namespace and binds a namespace to a namespace prefix. The default namespace is applied to names that do not have an explicit namespace component. … If you declare an @namespace rule with a prefix, you can use the prefix in namespace-qualified names. …

最后，这里是MDN的文档： https://developer.mozilla.org/en-US/docs/Web/CSS/@namespace

And finally, here's MDN's doc: https://developer.mozilla.org/en-US/docs/Web/CSS/@namespace

@namespace 规则是定义将在样式表中使用的XML命名空间的规则。定义的命名空间可用于限制通用，类型和属性选择器仅选择该命名空间下的元素。 @namespace 规则通常仅在处理包含多个命名空间的XML文档时有用 - 例如，嵌入了SVG的XHTML文档。

The @namespace rule is an at-rule that defines the XML namespaces that will be used in the style sheet. The namespaces defined can be used to restrict the universal, type, and attribute selectors to only select elements under that namespace. The @namespace rule is generally only useful when dealing with an XML document containing multiple namespaces—for example, an XHTML document with SVG embedded.

@namespace 规则可用于定义样式表的默认命名空间。当定义一个默认命名空间时，所有通用和类型选择器（但不是属性选择器，见下面的注释）仅适用于该命名空间上的元素。

The @namespace rule can be used to define the default namespace for the style sheet. When a default namespace is defined, all universal and type selectors (but not attribute selectors, see note below) apply only to elements on that namespace.

@namespace 规则也可以用于为样式表定义命名空间前缀。当通用，类型或属性选择器以命名空间前缀为前缀时，该选择器仅匹配命名空间

The @namespace rule can also be used to define a namespace prefix for a style sheet. When a universal, type, or attribute selector is prefixed with a namespace prefix, then that selector only matches if the namespace (and not just the name in the case of type or attribute selectors) of the element or attribute matches.

当使用非XML HTML时，已知元素将被自动分配名称空间。这意味着即使HTML文档中的任何位置没有xmlns属性，HTML元素仍将处于XHTML命名空间。

When using non-XML HTML, known elements will be automatically be assigned namespaces. This means that HTML elements will act as though they are on the XHTML namespace, even if there is no xmlns attribute anywhere in the HTML document.

请注意，在XML中，除非前缀直接在属性上定义，该属性没有命名空间。换句话说，属性不继承它们所在的元素的命名空间。为了匹配这种行为，CSS中的默认命名空间不适用于属性选择器。

Note that in XML, unless a prefix is defined directly on an attribute, that attribute has no namespace. In other words, attributes do not inherit the namespace of the element they're on. To match this behaviour, the default namespace in CSS does not apply to attribute selectors.

这篇关于在CSS中@namespace的用途是什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！