-
Главная
-
CSS
-
Свойство align-items
← Перейти к списку свойств
Свойство flex-flow
включает в себя следующие свойства:
Поддержка браузеров
Синтаксис
flex-flow: flex-direction flex-wrap|initial|inherit
Значения свойства
Значение |
Описание |
flex-direction |
Указывает направление в котором распологаются флекс элементы. Возможные значения:
- row
- row-reverse
- column
- column-reverse
- initial
- inherit
|
flex-wrap |
Указывает, должны ли флекс элементы переноситься или нет. Возможные значения:
- nowrap
- wrap
- wrap-reverse
- initial
- inherit
|
initial |
Устанавливает значение по умолчанию. |
inherit |
Унаследует значение свойства от родительского элемента. |
Песочница
Код в песочнице можно редактировать и видеть результат в реальном времени:
<div class="flex">
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
</div>
HTML
.flex {
display: flex;
align-items: center;
width: 360px;
height: 200px;
border: 1px solid #ddd;
flex-flow: row-reverse nowrap
}
.item {
height: 120px;
width: 120px;
}
.item:nth-child(1) {
background: yellow
}
.item:nth-child(2) {
background: blue;
}
.item:nth-child(3) {
background: beige
}
CSS
← Перейти к списку свойств