Propriété CSS grid-template-rows
Exemple
Spécifiez la taille de la ligne (hauteur) :
.grid-container {
display: grid;
grid-template-rows:
100px 300px;
}
Définition et utilisation
La grid-template-rowspropriété spécifie le nombre (et les hauteurs) des lignes dans une disposition en grille.
Les valeurs sont une liste séparée par des espaces, où chaque valeur spécifie la hauteur de la ligne respective.
| Valeur par défaut: | rien |
|---|---|
| Hérité: | non |
| Animable : | Oui. En savoir plus sur l'animation |
| Version: | Module de disposition de grille CSS niveau 1 |
| Syntaxe JavaScript : | objet .style.gridTemplateRows="50px 200px" |
Prise en charge du navigateur
Les nombres dans le tableau indiquent la première version du navigateur qui prend entièrement en charge la propriété.
| Property | |||||
|---|---|---|---|---|---|
| grid-template-rows | 57 | 16 | 52 | 10 | 44 |
Syntaxe CSS
grid-template-rows: none|auto|max-content|min-content|length|initial|inherit;
Valeurs de propriété
| Value | Description | Play it |
|---|---|---|
| none | No size is set. Rows are created if needed | |
| auto | The size of the rows is determined by the size of the container, and on the size of the content of the items in the row | |
| max-content | Sets the size of each row to depend on the largest item in the row | |
| min-content | Sets the size of each row to depend on the smallest item in the row | |
| length | Sets the size of the rows, by using a legal length value. Read about length units |
Pages connexes
Tutoriel CSS : Mise en page de la grille CSS
Référence CSS : La propriété grid-columns
Référence CSS : La propriété grid-template