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.