<display-outside>

Die <display-outside> Schlüsselwörter geben den äußeren display Typ eines Elements an, der im Wesentlichen seine Rolle im Fließlayout beschreibt. Diese Schlüsselwörter werden als Werte der display Eigenschaft verwendet und können für Legacy-Zwecke als einzelnes Schlüsselwort verwendet werden oder wie in der Level-3-Spezifikation definiert, zusammen mit einem Wert aus den <display-inside> Schlüsselwörtern.

Syntax

Gültige <display-outside> Werte:

block: Das Element erzeugt ein Blockelement-Box, das sowohl vor als auch nach dem Element Zeilenumbrüche im normalen Fluss erzeugt.
inline: Das Element erzeugt eine oder mehrere Inlineelement-Boxen, die vor oder nach sich selbst keine Zeilenumbrüche erzeugen. Im normalen Fluss wird das nächste Element in derselben Zeile sein, wenn ausreichend Platz vorhanden ist.

Hinweis: Wenn Browser auf eine Display-Eigenschaft mit nur einem äußeren display Wert stoßen (z.B. display: block oder display: inline), wird der innere Wert auf flow Voreingestellt (z.B. display: block flow und display: inline flow). Dies ist rückwärtskompatibel mit der Einzel-Schlüsselwort-Syntax.

Formale Syntax

<display-outside> = 
  block   |
  inline  |
  run-in

Beispiele

Im folgenden Beispiel werden span-Elemente (normalerweise als Inlineelemente angezeigt) auf display: block gesetzt, wodurch sie in neue Zeilen umbrechen und sich im Inline-Dimensionsbereich ihres Containers ausweiten.

HTML

html

<span>span 1</span> <span>span 2</span>

CSS

css

span {
  display: block;
  border: 1px solid rebeccapurple;
}

Ergebnis

Spezifikationen

Specification
CSS Display Module Level 3 # typedef-display-outside

Help improve MDN

Learn how to contribute Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden

<display-outside>

Syntax

Formale Syntax

Beispiele

HTML

CSS

Ergebnis

Spezifikationen

Browser-Kompatibilität

css.properties.display.block

css.properties.display.inline

Siehe auch

Help improve MDN