Свойство CSS grid-row-end
Пример
Сделайте так, чтобы "item1" занимал 3 строки:
.item1 {
grid-row-end: span 3;
}
Определение и использование
Свойство grid-row-end
определяет, сколько строк будет охватывать элемент или на какой строке строки элемент будет заканчиваться (см. пример в конце этой страницы).
Значение по умолчанию: | авто |
---|---|
Унаследовано: | нет |
Анимация: | да. Читать об анимации |
Версия: | Модуль CSS Grid Layout Уровень 1 |
Синтаксис JavaScript: | объект .style.gridRowEnd="4" |
Поддержка браузера
Цифры в таблице указывают на первую версию браузера, которая полностью поддерживает это свойство.
Property | |||||
---|---|---|---|---|---|
grid-row-end | 57 | 16 | 52 | 10 | 44 |
Синтаксис CSS
grid-row-end:
auto|row-line|span n;
Значения свойств
Value | Description | Play it |
---|---|---|
auto | Default value. The item will span one row. | |
span n | Specifies the number of rows the item will span. | |
row-line | Specifies on which row to end the display of the item. |
Дополнительные примеры
Пример
Вы можете использовать значения строки строки вместо количества строк для охвата:
.item1 {
grid-row-end: 3;
}
Связанные страницы
Учебное пособие по CSS: CSS Grid Layout