Replaced elements

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

Einfacher ausgedrückt, sind es Elemente, deren Inhalt nicht von den Stilen des aktuellen Dokuments beeinflusst wird. Die Position des ersetzten Elements kann mit CSS beeinflusst werden, jedoch nicht der Inhalt des ersetzten Elements selbst. Einige ersetzte Elemente, wie z.B. <iframe>-Elemente, können eigene Stylesheets haben, erben jedoch nicht die Stile des übergeordneten Dokuments.

Der einzige andere Einfluss, den CSS auf ein ersetzt Element haben kann, ist, dass es Eigenschaften gibt, die die Positionierung des Inhalts des Elements innerhalb seines Kastens steuern. Siehe Positionierung des Objekts innerhalb des Inhaltskastens steuern für weitere Informationen.

Ersetzte Elemente

Typische ersetzte Elemente sind:

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

Die HTML-Spezifikation besagt auch, dass ein <input>-Element ersetzt werden kann, da <input>-Elemente des Typs "image" ersetzte Elemente ähnlich zu <img> sind. Andere Formularelemente, einschließlich anderer Typen von <input>-Elementen, sind jedoch ausdrücklich als nicht ersetzte Elemente aufgeführt (die Spezifikation beschreibt ihre standardmäßige plattformspezifische Darstellung mit dem Begriff "Widgets").

Objekte, die mit der CSS-Eigenschaft content eingefügt werden, sind anonyme ersetzte Elemente. Sie sind „anonym“, weil sie im HTML-Markup nicht vorhanden sind.

Verwendung von CSS mit ersetzten Elementen

CSS behandelt ersetzte Elemente in einigen Fällen spezifisch, wie beim Berechnen von Rändern und einigen auto-Werten.

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

Positionierung des Objekts innerhalb des Inhaltskastens steuern

Bestimmte CSS-Eigenschaften können verwendet werden, um festzulegen, wie das innerhalb des ersetzten Elements enthaltene Objekt innerhalb des Bereichs 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 Kasten des enthaltenen Elements angepasst werden sollte. 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 Kastens des Elements an.

Siehe auch