@namespace
is an at-rule that defines XML namespaces to be used in a [[../../../Glossary/CSS|CSS]] style sheet.
Syntax
/* Default namespace */
@namespace url(XML-namespace-URL);
@namespace "XML-namespace-URL";
/* Prefixed namespace */
@namespace prefix url(XML-namespace-URL);
@namespace prefix "XML-namespace-URL";
Description
The defined namespaces can be used to restrict the universal, type, and attribute [[../../../Learn/CSS/Building_blocks/Selectors|selectors]] to only select elements within that namespace. The @namespace
rule is generally only useful when dealing with documents containing multiple namespaces—such as HTML5 with inline SVG or MathML, or XML that mixes multiple vocabularies.
Any @namespace
rules must follow all @charset and @import rules, and precede all other at-rules and style declarations in a style sheet.
@namespace
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 in that namespace.
The @namespace
rule can also be used to define a namespace prefix. When a universal, type, or attribute selector is prefixed with a namespace prefix, then that selector only matches if the namespace and name of the element or attribute matches.
In HTML5, known foreign elements will automatically be assigned namespaces. This means that HTML elements will act as though they are in the XHTML namespace (http://www.w3.org/1999/xhtml
), even if there is no xmlns
attribute anywhere in the document, and the <svg> and <math> elements will be assigned their proper namespaces (http://www.w3.org/2000/svg
and http://www.w3.org/1998/Math/MathML
).
Note: In XML, unless a prefix is defined directly on an attribute (e.g., xlink:href
), 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.
Formal syntax
@namespace <namespace-prefix>? [ <string> | <url> ];where <namespace-prefix> = <ident>
Examples
Specifying default and prefixed namespaces
@namespace url(http://www.w3.org/1999/xhtml);
@namespace svg url(http://www.w3.org/2000/svg);
/* This matches all XHTML <a> elements, as XHTML is the default unprefixed namespace */
a {}
/* This matches all SVG <a> elements */
svg|a {}
/* This matches both XHTML and SVG <a> elements */
*|a {}
Specifications
Specification | Status | Comment |
---|---|---|
CSS Namespaces ModuleThe definition of '@namespace' in that specification. | Recommendation | Initial definition |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Update compatibility data on GitHub
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
@namespace
|
Chrome
Full support 1 |
Edge
Full support 12 |
Firefox
Full support 1 |
IE
Full support 9 |
Opera
Full support 8 |
Safari
Full support 1 |
WebView Android
Full support 37 |
Chrome Android
Full support 18 |
Firefox Android
Full support 4 |
Opera Android
Full support 14 |
Safari iOS
Full support 1 |
Samsung Internet Android
Full support 1.0 |
Legend
- Full support
- Full support
See also
@namespace by Mozilla Contributors is licensed under CC-BY-SA 2.5.