[go: up one dir, main page]

Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

Block-Element-Inhalt

In CSS wird Inhalt, der am Block-Layout teilnimmt, als Block-Element-Inhalt bezeichnet.

In einem Block-Layout werden die Boxen nacheinander vertikal, beginnend am oberen Rand eines umschließenden Blocks, angeordnet. Die linke Außenkante jeder Box berührt die linke Kante des umschließenden Blocks.
Ein Block-Element beginnt immer in einer neuen Zeile. In horizontalen Schreibrichtungen, wie Englisch oder Arabisch, nimmt es den gesamten horizontalen Raum seines Elternelements (Containers) ein und vertikalen Raum, der der Höhe seines Inhalts entspricht, wodurch ein "Block" entsteht.

Hinweis: Das oben beschriebene Verhalten des Block-Layouts ändert sich, wenn der writing-mode des umschließenden Blocks auf einen anderen Wert als den Standardwert gesetzt wird.

Hinweis: HTML (HyperText Markup Language) Elemente wurden historisch entweder als "Block-Level"-Elemente oder "Inline"-Elemente kategorisiert. Als eine präsentative Eigenschaft wird dies jetzt durch CSS spezifiziert.

Beispiele

In diesem Beispiel werden zwei Absatz-(<p>) Elemente in ein <div> gesetzt.

html
<div>
  <p>
    This the first paragraph. The background color of these paragraphs have been
    colored to distinguish them from their parent element.
  </p>
  <p>This is the second paragraph.</p>
</div>

Die Absatz-(<p>) Elemente sind standardmäßig Block-Elemente. Deshalb werden sie im Block-Layout angezeigt:

Siehe auch