CSS namespaces
The CSS namespaces module defines the syntax for using {{glossary("namespace", "namespaces")}} in CSS.
CSS isn't just for styling HTML. A stylesheet may be used to style SVG, MathML, XML, or HTML, each of which has a different namespace or a document containing multiple namespaces.
The @namespace
at-rule defined in this module enables distinguishing between same-named elements in different namespaces. Element tag names are not unique to a single language. For example, the <a>
element isn't limited to HTML. You may want to style the <a>
s within your SVGs differently from the links in your HTML. You also will likely want to ensure that {{domxref("Document.querySelectorAll", "querySelectorAll("a")")}} selects the right kind of element. Namespacing can help.
The @namespace
rule is used for declaring a default namespace and for binding namespaces to namespace prefixes. The namespaces module also defines the syntax for using these prefixes to represent namespace-qualified names. That's it. What a name means or if the name is even valid depends on the context and host language.
Reference
At-rules
- {{cssxref("@namespace")}}
Guides
-
- : Deep dive into what a namespace is and how they are used in XML and XML-based markup languages.
Related concepts
- CSS namespace separator (
|
) combinator - CSS type selectors
- CSS universal selector
- {{DOMXRef("CSSNamespaceRule")}} interface
- {{DOMXRef("CSSNamespaceRule.namespaceURI")}} property
- {{DOMXRef("CSSNamespaceRule.prefix")}} property
Document.createAttributeNS()
methodDocument.createElementNS()
methodDocument.getElementsByTagNameNS()
methodElement.getAttributeNodeNS()
methodElement.getAttributeNS()
methodElement.getElementsByTagNameNS()
methodElement.hasAttributeNS()
methodElement.namespaceURI
propertyElement.removeAttributeNS()
methodElement.setAttributeNS()
methodElement.setAttributeNodeNS()
methodNamedNodeMap.getNamedItemNS()
methodNamedNodeMap.removeNamedItemNS()
methodNamedNodeMap.setNamedItemNS()
method- {{glossary("Namespace")}} glossary term
Specifications
Browser compatibility
See also
<a>
SVG element- CSS
<url>
type - CSS at-rules
- CSS at-rule functions
- CSS selectors