CSS namespaces
TheCSS namespaces module defines the syntax for usingnamespaces 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 thatquerySelectorAll("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 and descriptors
Guides
- Namespaces crash course
Deep dive into what a namespace is and how they are used in XML and XML-based markup languages.
Related concepts
- CSSnamespace separator (
|) combinator - CSStype selectors
- CSSuniversal selector
CSSNamespaceRuleinterfaceCSSNamespaceRule.namespaceURIpropertyCSSNamespaceRule.prefixproperty
Document.createAttributeNS()methodDocument.createElementNS()methodDocument.getElementsByTagNameNS()methodElement.getAttributeNodeNS()methodElement.getAttributeNS()methodElement.getElementsByTagNameNS()methodElement.hasAttributeNS()methodElement.namespaceURIpropertyElement.removeAttributeNS()methodElement.setAttributeNS()methodElement.setAttributeNodeNS()methodNamedNodeMap.getNamedItemNS()methodNamedNodeMap.removeNamedItemNS()methodNamedNodeMap.setNamedItemNS()method- Namespace glossary term
Specifications
| Specification |
|---|
| CSS Namespaces Module Level 3 |