CSS/Namensraum
Inhaltsverzeichnis
Ein Namensraum ist, einfach umschrieben, ein eindeutig identifizierbares Verzeichnis, das alle Elemente einer Sprache umfasst. Mit Hilfe von Namensräumen können innerhalb eines XML-Dokument mehrere XML-Anwendungen (d. h. Sprachen wie XHTML und SVG) voneinander unterschieden und so gleichzeitig verwendet werden. Ein Beispiel: In XHTML und SVG gibt es ein Element mit dem Namen title
. Anhand der unterschiedlichen Namensräume kann der Browser erkennen, wie das Element verarbeitet werden muss.
Auch in HTML ab Version 5 werden Namensräume verwendet um das Einbinden von SVG- und MathML-Abschnitten zu ermöglichen. HTML-Elemente befinden sich im XHTML-Namensraum.
Ein Stylesheet kann von sich aus zunächst nicht zwischen Namensräumen unterscheiden. Das bedeutet z. B., dass Selektoren ein Element nur anhand seines Namens ansprechen, ohne den Namensraum des Elements zu berücksichtigen.
Soll ein Stylesheet zwischen verschiedenen Sprachen innerhalb eines Dokuments unterscheiden können, muss definiert werden, welche Namensräume angesprochen werden sollen. Dies geschieht mit der @-Regel @namespace
.
Namensräume definieren
@namespace
-Regeln müssen nach der @charset
- und allen @import
-Regeln, aber vor allen anderen @-Regeln und Regelsätzen notiert werden.
Der Geltungsbereich dieser Regel ist auf das Stylesheet begrenzt, in dem sie definiert wird. Das bedeutet, dass ein Stylesheet, welches ein Stylesheet mit einer @namespace
-Regel einbindet oder von einem solchen eingebunden wird, nicht selbst von der Regel beeinflusst wird.
Sie können mit der @namespace
-Regel zwei Dinge tun:
- Festlegen eines Standard-Namensraums für das Stylesheet
- Definieren eines Kurznamens für einen Namensraum
Standard-Namensraum für ein Stylesheet festlegen
Ähnlich, wie in XML ein Elementname ein Namespace-Präfix erhalten kann, ist dies auch in CSS möglich. Die Syntax dafür beschreiben wir weiter unten. Ohne ein solches Präfix sprechen Typselektoren die Elemente in allen Namensräumen an.
Wenn Sie erreichen möchten, dass in einem Stylesheet Typselektoren ohne Präfix nur die Elemente ansprechen, die einem bestimmten Namensraum angehören, dann können Sie einen Standard-Namensraum festgelegen. Die Syntax dafür ist:
@namespace "namespace-name"; @namespace url(namespace-name;
In diesem Fall folgt der einleitenden Anweisung @namespace
ein Leerzeichen sowie der Namensraum-Name als Zeichenkette oder als Parameter der url()-Funktion. Beendet wird die Regel durch ein Semikolon.
Die leere Zeichenkette (""
) ist als Namespace-Name zulässig und repräsentiert den Null-Namensraum. Dieser spezielle Namensraum ist in XML-Dokumenten relevant und enthält alle XML-Elemente, denen kein Namensraum zugeordnet wurde. In HTML Dokumenten ist es dagegen so, dass die HTML-Elemente dem Namensraum "http://www.w3.org/1999/xhtml" zugeordnet sind (auch dann, wenn es sich nicht um ein XHTML-Dokument handelt).
@namespace 'beispiel:eins';
beispiel { color: blue; }
absatz { color: green; }
Dieses Stylesheet könnte auf das folgende XML-Dokument angewendet werden. Es verwendet Elemente in den Namensräumen "beispiel:eins" und "beispiel:zwei", ohne dabei auf Namespace-Präfixe zurückzugreifen.
[[Beispiel|
<beispiel>
<beispiel xmlns="beispiel:eins">
<absatz>Erster Absatz.</absatz>
<absatz xmlns="beispiel:zwei">Zweiter Absatz.</absatz>
</beispiel>
<absatz>Dritter Absatz.</absatz>
<absatz xmlns="beispiel:eins">Vierter Absatz.</absatz>
<absatz xmlns="beispiel:zwei">Fünfter Absatz.</absatz>
</beispiel>
Das erste und das vierte absatz
-Element werden in grüner Schriftfarbe dargestellt, da beide Elemente dem Namensraum „beispiel:eins“ angehören.
Die übrigen absatz
-Elemente übernehmen die Schriftfarbe ihres Elternelements (auch wenn dieses einem anderen Namensraum angehört), da sie selbst keinem Namensraum angehören bzw. für ihren Namensraum kein Format festgelegt wurde. Dadurch wird das zweite Element in blauer Schriftfarbe dargestellt; das dritte und fünfte üblicherweise in schwarzer Schriftfarbe.
Definieren eines Namespace-Präfix
Unabhängig davon, ob ein Standard-Namensraum festgelegt wurde, kann es erforderlich sein, einzelne Selektoren auf Elemente eines bestimmten Namensraums anzuwenden. Dazu definieren Sie zunächst mit dieser Syntax einen Kurznamen für einen Namespace-Namen:
@namespace kurzname "namespace-name"; @namespace kurzname url(namespace-name;
Diese @-Regel hat keinen Einfluss auf den Standard-Namensraum. Sie definiert lediglich, dass es für den angegebenen Namespace einen Kurznamen geben soll.
Damit ein Typselektor nur Elemente anspricht, die dem festgelegten Namensraum angehören, muss der Elementname noch um ein Namensraum-Präfix ergänzt werden. Dazu verwendet man den Kurznamen und das Abgrenzungszeichen |
:
@namespace zwei 'beispiel:zwei';
beispiel { color: blue; }
zwei|absatz { color: green; }
<beispiel xmlns="beispiel:eins" xmlns:zwo="beispiel:zwei">
<absatz>Erster Absatz.</absatz>
<zwo:absatz>Zweiter Absatz.</zwo:absatz>
<absatz xmlns="beispiel:zwei">Dritter Absatz.</absatz>
</beispiel>
In diesem Beispiel wurde zwei
im Stylesheet als Kurzname für den Namensraum "beispiel:zwei" festgelegt und dann verwendet, um nur die absatz
-Elemente zu formatieren, denen dieser Namensraum zugeordnet ist.
Unabhängig vom Namensraum wird das beispiel
- und das erste absatz
-Element in blauer Schriftfarbe formatiert, denn ein Typselektor typ
, der kein Namespace-Präfix enthält, wird als *|typ
interpretiert. Deshalb gilt der Selektor beispiel
für alle Elemente.
Das Element zwo:absatz
sowie das dritte absatz
-Element werden in grüner Schriftfarbe dargestellt, da beide dem Namensraum „beispiel:zwei“ angehören.
Selektoren mit Namensraumangabe
Typ- und Universalselektoren können eine Namensraumangabe enthalten. Dazu wird dem Selektor ein vertikaler Strich („|
“) vorangestellt. Vor diesem Strich kann ein über @namespace
definierter Kurzname, ein Sternchen („*“) oder auch nichts weiter notiert werden. Die Bedeutung der einzelnen Selektoren wird nachfolgend erklärt.
Zum besseren Verständnis soll für die nachfolgenden Beispiele diese Kurznamen-Definition gelten:
@namespace ns 'http://www.example.org/';
Typselektor mit Namensraumangabe
Selektor | Beschreibung |
---|---|
ns|E
|
Spricht alle E -Elemente an, die dem Namensraum „http://www.example.org/“ angehören.
|
*|E
|
Spricht alle E -Elemente an, unabhängig davon, ob sie einem Namensraum angehören oder nicht.
|
|E
|
Spricht alle E -Elemente an, die keinem Namensraum angehören.
|
E
|
Wenn kein Standard-Namensraum festgelegt wurde, verhält sich dieser Selektor wie *|E . Wurde ein Standard-Namensraum definiert, gilt dieser Selektor nur für alle E -Elemente in diesem Namensraum.
|
Universalselektor mit Namensraumangabe
Der Universalselektor *
verhält sich bezüglich Namensräumen wie der Typselektor.
Attributselektor mit Namensraumangabe
Auch Attributselektoren können mit Namensraumangabe notiert werden. Gemäß XML und HTML gehören Attribute in der Regel keinem Namensraum an. Durch das Nutzen von Namensraum-Präfixen in XML oder durch die Verwendung namensraumspezifischer DOM-Methoden kann es dennoch vorkommen, dass Attribute mit einem Namensraum verknüpft sind.
Zur Erinnerung: Wird ein Attributselektor ohne Typselektor notiert (also [attr]
anstatt z. B. E[attr]
), so handelt es sich um eine Kurzschreibweise für *[attr]
. Das bedeutet, dass Attributselektoren üblicherweise den Namensraum von Elementen ignorieren (*|*[attr]
).
Wird jedoch ein Standard-Namensraum deklariert, so wirken Attributselektoren nur, wenn das Element diesem Namensraum angehört. Diese Einschränkung kann aber durch das Notieren von Typ- oder Universalselektor mit Namensraumangabe wieder aufgehoben werden.
Soll der Namensraum des Attributs berücksichtigt werden, wird der vertikale Strich vor dem Attributnamen, innerhalb der eckigen Klammer notiert.
Selektor | Normale Bedeutung | Bedeutung bei Deklaration eines Standard-Namensraums |
---|---|---|
[ns|attr]
|
Entspricht *|*[ns|attr] . Ein Element wird angesprochen, wenn sich das attr -Attribut im Namensraum „http://www.example.org/“ befindet. Der Namensraum des Elements spielt dabei keine Rolle.
|
Ein Element wird angesprochen, wenn es sich im Standard-Namensraum befindet und ein attr -Attribut besitzt, das sich im Namensraum „http://www.example.org/“ befindet.
|
[*|attr]
|
Entspricht *|*[*|attr] . Ein Element wird angesprochen, wenn es ein attr -Attribut besitzt. Namensraum von Element und Attribut sind dabei bedeutungslos.
|
Ein Element wird angesprochen, wenn es ein attr -Attribut besitzt. Der Namensraum des Attributs spielt dabei keine Rolle.
|
[|attr]
|
Entspricht *|*[|attr] . Ein Element wird angesprochen, wenn es ein attr -Attribut besitzt und dieses keinem Namensraum angehört.
|
Ein Element wird angesprochen, wenn es sich im Standard-Namensraum befindet und ein attr -Attribut besitzt, das keinem Namensraum angehört.
|
[attr]
|
Dieser Selektor verhält sich identisch zu [|attr] .
|
Weitere Selektoren mit Namensraumangabe
Wie bei Attributselektoren handelt es sich bei ID- und Klassenselektoren sowie Pseudoklassen und -elementen um Kurzschreibweisen, bei denen ein gedachter Universalselektor an erster Stelle steht (sofern die Selektoren nicht auf einen Elementtyp eingeschränkt wurden).
#id /* steht für */ *#id
.klasse /* steht für */ *.klasse
:only-child /* steht für */ *:only-child
::first-line /* steht für */ *:first-line
Normalerweise sprechen diese Selektoren jedes Element an, unabhängig von dessen Namensraum (z. B. *|*#id
, *|*:first-child
).
Durch das Festlegen eines Standard-Namensraums werden die Selektoren, wie oben notiert, nur Elemente ansprechen, die dem Standardnamensraum angehören. Das Notieren eines Typ- oder Universalselektors mit Namensraumangabe kann diese Einschränkung für einen Selektor wieder aufheben.
- spricht unabhängig vom Namensraum das Element mit der ID „id“ an.
*|*#id
- spricht alle Elemente im Namensraum „http://www.example.org/“ mit der Klasse „klasse“ an.
ns|*.klasse
- spricht jedes zweite
|element:nth-child(even)
element
-Kindelement an, sofern es keinem Namensraum angehört.