flex-direction
Обновлено: 29.03.2023
flex-direction
Свойство flex-direction задаёт направление основных осей в контейнере и тем самым определяет положение флексов в контейнере. На само направление также влияет значение атрибута dir у контейнера.
Краткая информация
Значение по умолчанию | row |
Наследуется | Нет |
Применяется | К флекс-контейнеру |
Анимируется | Нет |
Синтаксис
flex-direction: row | row-reverse | column | column-reverse
Значения
row | Главная ось направлена так же, как и ориентация текста, по умолчанию слева направо. Если значение dir задано как rtl, то направление оси идёт справа налево. |
row-reverse | Похоже на значение row, но меняются местами начальная и конечная точки и главная ось направлена справа налево. Если значение dir задано как rtl, то направление оси идёт слева направо. |
column | Главная ось располагается вертикально и направлена сверху вниз. |
column-reverse | Главная ось располагается вертикально, но меняется положение начальной и конечной точек и ось направлена снизу вверх. |
Пример
Объектная модель
Объект.style.flexDirection
Примечание
Safari до версии 9 поддерживает свойство -webkit-flex-direction.