Vorlage für CSS-Eigenschaftsseite

Note: Entfernen Sie diesen Hinweisblock vor der Veröffentlichung.

Seiteneinleitung:

Die Einleitung am oberen Rand der Seite wird verwendet, um "Metadaten der Seite" zu definieren. Die Werte sollten entsprechend für die jeweilige Eigenschaft aktualisiert werden.
md
---
title: NameDerEigenschaft
slug: Web/CSS/NameDerEigenschaft
page-type: css-property OR css-shorthand-property
status:
  - deprecated
  - experimental
  - non-standard
browser-compat: css.properties.NameDerEigenschaft
sidebar: cssref
---
title

Der title-Wert wird oben auf der Seite angezeigt. Das Titelformat ist NameDerEigenschaft. Zum Beispiel hat die background-color-Eigenschaft einen Titel von background-color.

slug

Der slug-Wert ist das Ende des URL-Pfads nach https://developer.mozilla.org/de/docs/. Dies wird als Web/CSS/NameDerEigenschaft formatiert. Zum Beispiel ist der Slug für die background-color-Eigenschaft Web/CSS/background-color. Für eine mehrteilige Komponente wie Getting_started in einem Slug sollte der Slug einen Unterstrich verwenden, wie in /de/docs/Learn_web_development/Core/Structuring_content.

page-type

Der page-type-Wert für CSS-Eigenschaften ist css-property. Für eine Kurzform-CSS-Eigenschaft ist der Wert css-shorthand-property. Zum Beispiel ist der page-type-Wert für die animation-Eigenschaft css-shorthand-property, weil es sich um eine Kurzform handelt, während der page-type für die animation-delay-Eigenschaft css-property ist.

status

Kennzeichen, die den Status dieser Funktion beschreiben. Ein Array, das einen oder mehrere der folgenden Werte enthalten kann: experimental, deprecated, non-standard. Dieser Schlüssel sollte nicht manuell gesetzt werden: Er wird automatisch basierend auf Werten in den Browser-Kompatibilitätsdaten für die Funktion festgelegt. Siehe "How feature statuses are added or updated".

browser-compat

Ersetzen Sie den Platzhalterwert css.properties.NameDerEigenschaft mit der Abfragezeichenfolge für die Eigenschaft im Browser compat data repo. Überprüfen Sie den Abschnitt Other macros in the page in diesem Hinweisblock, um zu sehen, wie dieses Schlüssel-Wert-Paar verwendet wird, um Inhalte für die Abschnitte Specifications und Browser-Kompatibilität zu erzeugen.

sidebar

Dies ist cssref für alle CSS-Leitfaden- und Referenzseiten. Siehe Page structures: Sidebars für Details.

Makros am oberen Rand der Seite

Einige Makroaufrufe erscheinen am obersten Rand des Inhaltsabschnitts (unmittelbar unter der Seiteneinleitung). Diese Makros werden automatisch von der Toolchain hinzugefügt (es besteht keine Notwendigkeit hinzuzufügen/zu entfernen):

{{SeeCompatTable}}: Dieses Makro erzeugt ein Experimentell-Banner, das anzeigt, dass die Technologie experimentell ist. Wenn die Technologie experimentell ist und hinter einer Einstellung in Firefox verborgen ist, sollten Sie auch einen Eintrag dafür auf der Seite Experimental features in Firefox ausfüllen.

{{Deprecated_Header}}: Dieses Makro erzeugt ein Veraltet-Banner, das anzeigt, dass die Nutzung der Technologie nicht empfohlen ist.

{{Non-standard_Header}} — dies erzeugt ein Nicht-standardisiertes-Banner, das darauf hinweist, dass die Funktion nicht Teil irgendeiner Spezifikation ist.

Sie sollten die folgenden Makros gemäß den unten stehenden Ratschlägen aktualisieren oder löschen:

Führen Sie Status-Header-Makros nicht manuell ein. Beziehen Sie sich auf den Abschnitt "How feature statuses are added or updated", um diese Status der Seite hinzuzufügen.

Beispiele für die Experimentell, Veraltet, und Nicht-standardisiert Banner werden direkt nach diesem Hinweisblock gezeigt.

Andere Makros auf der Seite

Abschnitt zur formalen Syntax: Der Inhalt für den Abschnitt Formal syntax wird mit dem Makro {{CSSSyntax}} generiert. Dieses Makro ruft Daten aus den Spezifikationen mit dem @webref/css npm package ab.

Abschnitt zur formalen Definition: Der Inhalt für den Abschnitt Formal definition wird mit dem Makro {{CSSInfo}} generiert. Damit dieser Abschnitt Daten hat, müssen Sie sicherstellen, dass ein entsprechender Eintrag für die entsprechende Eigenschaft in der properties.json Datei im mdn/data-Repository ausgefüllt wurde. Siehe die Properties-Seite für weitere Informationen.

Abschnitte Spezifikationen und Browser-Kompatibilität: Das Build-Tool verwendet automatisch das browser-compat Schlüssel-Wert-Paar aus der Seiteneinleitung, um Daten in die Abschnitte Specifications und Browser-Kompatibilität einzufügen (ersetzt die {{Specifications}} und {{Compat}} Makros in diesen Abschnitten jeweils).

Beachten Sie, dass Sie möglicherweise zuerst einen Eintrag für die Eigenschaft und ihre Spezifikation in unserem Browser compat data repo erstellen/aktualisieren müssen. Siehe unseren Leitfaden für Kompatibilitätstabellen für Informationen zum Hinzufügen oder Bearbeiten von Einträgen.

Denken Sie daran, diesen Hinweisblock 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.

Beginnen Sie den Inhalt auf der Seite mit einem einleitenden Absatz, der die Eigenschaft benennt und beschreibt, was sie tut. Dies sollte idealerweise ein oder zwei kurze Sätze sein.

Probieren Sie es aus

Dieser Abschnitt wird durch das InteractiveExample-Makro generiert. Dies umfasst den Abschnittstitel "Probieren Sie es aus" und den Code-Editor. Siehe den Abschnitt Interaktive Beispiele in unseren Schreibrichtlinien für weitere Informationen.

Zugehörige Eigenschaften

Fügen Sie diesen Abschnitt nur für Kurzformeigenschaften hinzu, wie animation, um alle zugehörigen Langformeigenschaften aufzulisten.

Syntax

Fügen Sie die häufig verwendeten Anwendungsfälle als Codeblock ein und beschreiben Sie die Komponenten-Subwerte, die einen vollständigen Wert bilden.

css

/* Insert code block showing common use cases */
/* or categories of values */

Werte

Fügen Sie einen Begriff und eine Definition für jeden Subwert hinzu.

subvalue1: Fügen Sie eine Beschreibung des Subwerts, seinen Datentyp und seine Bedeutung hinzu.
subvalue2: Fügen Sie eine Beschreibung des Subwerts, seinen Datentyp und seine Bedeutung hinzu.

Warnung: Fügen Sie keine Status-Makros in Zeilen zu CSS-Seiten hinzu.

Beschreibung

Dies ist ein optionaler Abschnitt, um eine Beschreibung der Eigenschaft hinzuzufügen und zu erklären, wie sie funktioniert. Verwenden Sie diesen Abschnitt, um verwandte Begriffe zu erläutern und Anwendungsfälle für die Eigenschaft hinzuzufügen.

Formale Definition

{{CSSInfo}}

Um dieses Makro zu verwenden, entfernen Sie die Backticks und den Backslash in der Markdown-Datei.

Formale Syntax

{{CSSSyntax}}

Um dieses Makro zu verwenden, entfernen Sie die Backticks und den Backslash in der Markdown-Datei.

Barrierefreiheit

Dies ist ein optionaler Abschnitt. Beziehen Sie Barrierefreiheitsempfehlungen, Best Practices und mögliche Bedenken ein, die Entwickler beim Verwenden dieser Eigenschaft beachten sollten. Sie können auch Workarounds oder Lösungen dort einfügen, wo sie zutreffen.

Beispiele

Beachten Sie, dass wir den Plural "Beispiele" verwenden, auch wenn die Seite nur ein Beispiel enthält.

Fügen Sie einen beschreibenden Titel hinzu

Jedes Beispiel muss eine H3-Überschrift (###) haben, die das Beispiel benennt. 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 unseren Leitfaden, wie man Codebeispiele hinzufügt, für mehr Informationen.

Hinweis: Manchmal möchten Sie auf Beispiele verlinken, die auf einer anderen Seite gegeben sind.

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 hinzu, und dann eine finale H3-Überschrift (###) mit dem Text "Weitere Beispiele", unter der Sie auf die Beispiele auf anderen Seiten verlinken können. Zum Beispiel:

## Beispiele

### Verwendung der fetch API

Beispiel von 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 zu fetch()](https://example.org/).

link1
link2
external_link (Jahr)