Referenz:CSS/Eigenschaften/grid-template-rows

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche
Eigenschaft grid-template-rows CSS 3.0
Beschreibung Die grid-template-rows-Eigenschaft legt Anzahl und Größen der Zeilen fest (track sizing functions).
erlaubte Werte
  • none
  • eine <track-list>
  • eine <auto-track-list

Die Werte entsprechen einer Leerzeichen-separierten Liste von:

default-Wert
  • none
anwendbar auf alle Elemente (Unterschied Tag Element Attribut)
Vererbung nein
animierbar nein
Browsersupport
  • Chrome
  • Firefox
  • IE 10
  • Opera
  • Safari
Spezifikation W3c logo klein.gif grid-template-rows
Beispiel
body {
  grid-template-rows: 200px 500px 200px; 
}
body {
  display: grid;
  grid-template-columns: repeat(12 fr1); 
}

Im oberen Teil besteht der body aus 3 Zeilen, von denen die mittlere statt 200px aber 500px hoch ist; die zweite Festlegung verwendet die repeat()-Funktion, die 12 gleichhohe Zeilen erzeugt.

Beachten Sie

IE10, IE 11 und Edge-12-15 verwenden eine ältere Spezifikation, in der diese Eigenschaft unter dem Namen -ms-grid-rows implementiert ist.
Auch ohne Angabe dieser Eigenschaft verteilt sich der vohandene Inhalt über das Raster, indem er die Zeilen Spalte für Spalte füllt.

Tipp

{{{Tipp}}}