CSS-Selektor-Seitenvorlage
Hinweis: Entfernen Sie diese gesamte erläuternde Anmerkung vor der Veröffentlichung
Seiteneinleitung:
Die Frontmatter am Anfang der Seite wird verwendet, um "Seitenmetadaten" zu definieren. Die Werte sollten für den jeweiligen Selektor entsprechend aktualisiert werden.
---
title: :name-of-the-selector
slug: Web/CSS/Reference/Selectors/:name-of-the-selector
page-type: css-selector OR css-pseudo-class OR css-pseudo-element OR css-combinator
status:
- deprecated
- experimental
- non-standard
browser-compat: css.selectors.name-of-the-selector
sidebar: cssref
---
- title
-
Titelüberschrift, die oben auf der Seite angezeigt wird. Format als :NameOfTheSelector. Zum Beispiel hat der
:hoverSelektor einen Titel von :hover. - slug
-
Das Ende des URL-Pfads nach
https://developer.mozilla.org/de/docs/). Dieser wird wie folgt formatiert:Web/CSS/Reference/Selectors/:name-of-the-selector. Zum Beispiel hat der:hoverSelektor den SlugWeb/CSS/Reference/Selectors/:hover. - page-type
-
Der
page-typeSchlüssel für CSS-Eigenschaften ist einer voncss-selector,css-pseudo-class, odercss-pseudo-element, abhängig davon, ob der Selektor eine pseudo-class, ein pseudo-element, ein combinator, oder ein simple selector ist. - status
-
Kennzeichnungen, die den Status dieses Features beschreiben. Ein Array, das einen oder mehrere der folgenden Begriffe enthalten kann:
experimental,deprecated,non-standard. Dieser Schlüssel sollte nicht manuell gesetzt werden: Er wird automatisch basierend auf den Werten in den Browser-Kompatibilitätsdaten für das Feature gesetzt. Siehe "Wie Feature-Statuses hinzugefügt oder aktualisiert werden". - browser-compat
-
Ersetzen Sie den Platzhalterwert
css.selectors.NameOfTheSelectormit der Abfragezeichenfolge für den Selektor im Browser-compat-Daten-Repo. Die Toolchain verwendet automatisch den Schlüssel, um die Kompatibilitäts- und Spezifikationsabschnitte zu füllen (ersetzt die{{Compat}}und{{Specifications}}Makros in diesen Abschnitten, entsprechend).Beachten Sie, dass Sie möglicherweise zuerst einen Eintrag für den Selektor und seine Spezifikation in unserem Browser-compat-Daten-Repo erstellen/aktualisieren müssen. Siehe unseren Leitfaden, wie Sie dies tun können.
-
Dies ist
cssreffür alle CSS-Leitfaden- und Referenzseiten. Siehe Seitenstrukturen: Sidebars für Details.
Macros am Anfang der Seite
Eine Reihe von Makros erscheint am Anfang des Inhaltsbereichs unmittelbar nach der Seiteneinleitung. Diese Makros werden automatisch durch Werkzeuge hinzugefügt, vermeiden Sie das Hinzufügen oder Entfernen dieser:
{{SeeCompatTable}}— dies generiert ein Diese Technologie ist experimentell Banner, das darauf hinweist, dass die Technologie experimentell ist. Wenn es experimentell ist und die Technologie hinter einem Pref in Firefox versteckt ist, sollten Sie auch einen Eintrag dafür auf der Seite Experimentelle Funktionen in Firefox ausfüllen.{{Deprecated_Header}}— dies generiert ein Veraltet Banner, das darauf hinweist, dass die Verwendung der Technologie nicht empfohlen wird.{{Non-standard_Header}}— dies generiert ein Nicht-standard Banner, das darauf hinweist, dass das Merkmal nicht Teil einer Spezifikation ist.
Sie sollten die folgenden Makros gemäß der unten stehenden Hinweise aktualisieren oder löschen:
Stellen Sie keine Statuskopfzeilen-Makros manuell bereit. Beziehen Sie sich auf den Abschnitt "Wie Feature-Statuses hinzugefügt oder aktualisiert werden", um diese Status zur Seite hinzuzufügen.
Beispiele der Experimentellen, Veralteten und Nicht-standard Banner werden direkt nach diesem Hinweisblock gezeigt.
Syntax Abschnitt ({{CSSSyntax}})
Der Inhalt des Syntaxabschnitts wird mittels des {{CSSSyntax}} Makros erzeugt.
Damit diese populiert werden, müssen Sie sicherstellen, dass ein entsprechender Eintrag für den Selektor in unserer selectors.json Datendatei ausgefüllt wurde.
Siehe selectors.md für weitere Informationen.
Denken Sie daran, diesen gesamten erläuternden Hinweis vor der Veröffentlichung zu entfernen
Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.
Veraltet: Diese Funktion wird nicht mehr empfohlen. Obwohl einige Browser sie möglicherweise noch unterstützen, könnte sie bereits aus den relevanten Webstandards entfernt worden sein, in Kürze entfernt werden oder nur noch aus Kompatibilitätsgründen bestehen. Vermeiden Sie die Verwendung und aktualisieren Sie vorhandenen Code, falls möglich; siehe die Kompatibilitätstabelle am Ende dieser Seite, um Ihre Entscheidung zu unterstützen. Beachten Sie, dass diese Funktion jederzeit aufhören könnte zu funktionieren.
Nicht standardisiert: Diese Funktion ist nicht standardisiert. Wir raten davon ab, nicht-standardisierte Funktionen auf produktiven Webseiten zu verwenden, da sie nur von bestimmten Browsern unterstützt werden und sich in Zukunft ändern oder entfernt werden können. Unter Umständen kann sie jedoch eine geeignete Option sein, wenn es keine standardisierte Alternative gibt.
Der zusammenfassende Absatz — beginnen Sie mit der Nennung des Selektors und was er tut. Dies sollte idealerweise ein oder zwei kurze Sätze sein.
/* Insert code block showing common use cases */
Syntax
{{CSSSyntax}}
Um dieses Makro zu verwenden, entfernen Sie die Backticks und den Backslash in der Markdown-Datei.
Barrierefreiheit
Dies ist ein optionaler Abschnitt. Fügen Sie Zugangsrichtlinien, bewährte Verfahren und potenzielle Bedenken ein, die Entwicklern bewusst sein sollten, wenn sie diese Eigenschaft verwenden. Sie können auch Lösungen oder Workarounds dort einbeziehen, wo zutreffend.
Beispiele
Beachten Sie, dass wir den Plural "Beispiele" verwenden, selbst wenn die Seite nur ein Beispiel enthält.
Eine beschreibende Überschrift
Jedes Beispiel muss eine H3-Überschrift (###) mit der Benennung des Beispiels haben. Die Überschrift sollte beschreiben, was das Beispiel tut. Zum Beispiel sagt "Ein einfaches Beispiel" nichts über das Beispiel aus und ist daher keine gute Überschrift. Die Überschrift sollte prägnant sein. Für eine längere Beschreibung verwenden Sie den Absatz nach der Überschrift.
Siehe unsere Anleitung zum Hinzufügen von Codebeispielen für weitere Informationen.
Hinweis: Manchmal möchten Sie auf Beispiele verlinken, die auf einer anderen Seite gegeben werden.
Szenario 1: Wenn Sie einige Beispiele auf dieser Seite und einige weitere Beispiele auf einer anderen Seite haben:
Fügen Sie eine H3-Überschrift (###) für jedes Beispiel auf dieser Seite ein und dann eine letzte H3-Überschrift (###) mit dem Text "Weitere Beispiele", unter dem Sie auf die Beispiele auf anderen Seiten verlinken können. Zum Beispiel:
## Beispiele
### Verwendung der Fetch-API
Beispiel des Fetch
### Weitere Beispiele
Links zu weiteren Beispielen auf anderen Seiten
Szenario 2: Wenn Sie nur Beispiele auf einer anderen Seite und keine auf dieser Seite haben:
Fügen Sie keine H3-Überschriften hinzu; fügen Sie einfach die Links direkt unter der H2-Überschrift "Beispiele" hinzu. Zum Beispiel:
## Beispiele
Für Beispiele dieser API, siehe [die Seite über fetch()](https://example.org/).
Spezifikationen
{{Specifications}}
Um dieses Makro zu verwenden, entfernen Sie die Backticks und den Backslash in der Markdown-Datei.
Browser-Kompatibilität
{{Compat}}
Um dieses Makro zu verwenden, entfernen Sie die Backticks und den Backslash in der Markdown-Datei.
Siehe auch
Fügen Sie Links zu Referenzseiten und Leitfäden hinzu, die sich auf den aktuellen Selektor beziehen. Für weitere Richtlinien siehe den Siehe-auch-Abschnitt in der Schreibstil-Leitfaden.
- link1
- link2