СSS Свойство flex-wrap
Пример
Сделать гибкие элемент обернуть при необходимости:
div {
display: -webkit-flex; /* Safari */
-webkit-flex-wrap: wrap; /* Safari 6.1+ */
display: flex;
flex-wrap: wrap;
}
Редактор кода »
Определение и использование
Свойство flex-wrap указывает, следует ли переносить гибкие элементы.
Примечание: Если элементы не являются гибкими элементами, то свойство flex-wrap не имеет никакого эффекта.
| Значение по умолчанию: | nowrap |
|---|---|
| Унаследованный: | нет |
| Анимируемый: | нет Прочитайте о animatable |
| Версия: | CSS3 |
| JavaScript синтаксис: | object.style.flexWrap="nowrap" Попробовать |
Поддержка браузеров
Числа в таблице указывают первую версию браузера, которая полностью поддерживает свойство.
Числа, за которыми следует -webkit- или -moz- указывают первую версию, которая работала с префиксом.
| Свойство | |||||
|---|---|---|---|---|---|
| flex-wrap | 29.0 21.0 -webkit- |
11.0 | 28.0 18.0 -moz- |
9.0 6.1 -webkit- |
17.0 |
CSS Синтаксис
flex-wrap: nowrap|wrap|wrap-reverse|initial|inherit;
Значение свойств
| Значение | Описание | Воспроизвести |
|---|---|---|
| nowrap | Значение по умолчанию. Указывает, что гибкие элементы не будут обернуты | Воспроизвести » |
| wrap | Указывает, что гибкие элементы будут обернуты при необходимости | Воспроизвести » |
| wrap-reverse | Указывает, что гибкие элементы будут обернуты, при необходимости, в обратном порядке | Воспроизвести » |
| initial | Устанавливает для этого свойства значение по умолчанию. Прочитайте о initial | Воспроизвести » |
| inherit | Наследует это свойство от родительского элемента. Прочитайте о inherit |
Связанные страницы
CSS Учебник: CSS Гибкий бокс
CSS Справочник: Свойство flex
CSS Справочник: Свойство flex-flow
CSS Справочник: Свойство flex-direction
CSS Справочник: Свойство flex-basis
CSS Справочник: Свойство flex-grow
CSS Справочник: Свойство flex-shrink
HTML DOM Справочник: Свойство flexWrap
