Ersetzte Elemente

In CSS ist ein ersetztes Element ein Element, dessen Darstellung außerhalb des CSS-Scope liegt; es sind externe Objekte, deren Darstellung unabhängig vom CSS-Formatierungsmodell ist.

Einfacher gesagt sind es Elemente, deren Inhalte nicht von den Stilen des aktuellen Dokuments beeinflusst werden. Die Position des ersetzten Elements kann mit CSS beeinflusst werden, nicht jedoch die Inhalte des ersetzten Elements selbst. Einige ersetzte Elemente, wie <iframe>-Elemente, können eigene Stylesheets haben, aber sie erben nicht die Stile des übergeordneten Dokuments.

Der einzige weitere Einfluss, den CSS auf ein ersetztes Element haben kann, besteht darin, dass es Eigenschaften gibt, die die Positionierung des Inhalts des Elements innerhalb seines Rahmens steuern. Weitere Informationen finden Sie unter Steuern der Objektposition innerhalb des Inhaltsrahmens.

Ersetzte Elemente

Typische ersetzte Elemente sind:

Einige Elemente werden nur in bestimmten Fällen als ersetzte Elemente behandelt:

In der HTML-Spezifikation wird auch festgelegt, dass ein <input>-Element ersetzt werden kann, da <input>-Elemente des Typs "image" ersetzten Elementen wie <img> ähneln. Andere Formularelemente, einschließlich anderer Typen von <input>-Elementen, sind jedoch ausdrücklich als nicht ersetzte Elemente gelistet (die Spezifikation beschreibt deren standardmäßige plattformabhängige Darstellung mit dem Begriff "Widgets").

Mit der CSS-content-Eigenschaft eingefügte Objekte sind anonyme ersetzte Elemente. Sie sind "anonym", weil sie im HTML-Markup nicht existieren.

Verwendung von CSS mit ersetzten Elementen

CSS behandelt ersetzte Elemente speziell in einigen Fällen, wie bei der Berechnung von Abständen und einigen auto-Werten.

Beachten Sie, dass einige, aber nicht alle, ersetzte Elemente intrinsische Dimensionen oder eine definierte Basislinie haben, die von einigen CSS-Eigenschaften wie vertical-align verwendet wird. Nur ersetzte Elemente können jemals intrinsische Dimensionen haben.

Steuern der Objektposition innerhalb des Inhaltsrahmens

Bestimmte CSS-Eigenschaften können verwendet werden, um anzugeben, wie das in dem ersetzten Element enthaltene Objekt innerhalb des Rahmens des Elements positioniert werden soll. Diese sind in der CSS Images Spezifikation definiert:

object-fit

Gibt an, wie das Inhaltsobjekt des ersetzten Elements an den umgebenden Rahmen des Elements angepasst werden soll. Die object-fit-Eigenschaft hat keine Wirkung auf <iframe>, <embed> und <fencedframe>-Elemente.

object-position

Gibt die Ausrichtung des Inhaltsobjekts des ersetzten Elements innerhalb des Rahmens des Elements an.

Siehe auch