CSS grid-row-end Eigenschaft

Definition und Verwendung

Die grid-row-end-Eigenschaft legt fest, wie viele Zeilen das Element überquert oder an welcher Zeilenlinie das Element endet.

Siehe auch die Beispiele am Ende der Seite.

Weitere Informationen:

CSS-Tutorial:CSS-Grid-Layout

Beispiel

Beispiel 1

Machen Sie "item1" über drei Zeilen hinweg:

.item1 {
  grid-row-end: span 3;
}

Versuchen Sie es selbst

Beispiel 2

Sie können Zeilenwert anstelle der zu überquerenden Zeilenzahl verwenden:

.item1 {
  grid-row-end: 3;
}

Versuchen Sie es selbst

CSS-Syntax

grid-row-end: auto|row-line|span n;

Eigenschaftswert

Wert Beschreibung
auto Standardwert. Das Element überquert eine Zeile.
span n Bestimmt die Anzahl der Zeilen, die das Element überquert.
column-line Bestimmt, ab welcher Zeile die Anzeige der Elemente endet.

Technische Details

Standardwert: auto
Vererbung: Nein
Animationserstellung: Unterstützt. Siehe auch:Animationseigenschaften.
Version: CSS Grid Layout Modul Level 1
JavaScript-Syntax: object.style.gridRowEnd="4"

Browser-Unterstützung

Die Zahlen in der Tabelle geben die erste Browser-Version an, die diese Eigenschaft vollständig unterstützt.

Chrome IE / Edge Firefox Safari Opera
57 16 52 10 44