Атрибут CSS flex-flow
- предыдущая страница flex-direction
- следующая страница flex-grow
курсы рекомендованы:
определение и использование
атрибут flexFlow является сокращением для следующих атрибутов:备注:
если элемент не является эластичным элементом, то атрибут flex не действует.
еще см. также:CSS учебник:
атрибут flex-shrinkCSS эластичные контейнеры
атрибут flex-shrinkатрибут flex
атрибут flex-shrinkатрибут flex-direction
атрибут flex-shrinkатрибут flex-basis
атрибут flex-shrinkатрибут flex-grow
атрибут flex-shrinkCSS справочник:
атрибут flex-wrapHTML DOM справочник:
атрибут flexFlow
пример
показывать эластичные элементы в обратном направлении и переливаться на новую строку при необходимости: div { display: flex; flex-flow: row-reverse wrap;
попробуйте сами
CSS синтаксис
flex-flow: flex-direction flex-wrap|initial|inherit;
значение атрибута | значение |
---|---|
flex-direction |
flex-wrap
column-reverse по умолчанию "row". |
определяет направление эластичных элементов. |
flex-wrap
wrap-reverse по умолчанию "nowrap". |
установить этот атрибут в его значение по умолчанию. См. также | определяет, должны ли弹性 элементы переливаться на новую строку. установить этот атрибут в его значение по умолчанию. См. такжеатрибуты анимации |
от его родительского элемента. См. также | initial от его родительского элемента. См. такжеатрибуты анимации |
inherit
технические детали | по умолчанию: |
---|---|
row nowrap | наследование: |
нет | создание анимации:не поддерживается. См. также:атрибуты анимации |
. | версия: |
CSS3 | JavaScript синтаксис: |
object.style.flexFlow="column nowrap"
поддержка браузеров
числа в таблице указывают на первую версию браузера, которая полностью поддерживает этот атрибут.
Chrome | IE / Edge | Firefox | Safari | Opera |
---|---|---|---|---|
29.0 21.0 -webkit- |
11.0 | 28.0 18.0 -moz- |
9.0 6.1 -webkit- |
17.0 |
- предыдущая страница flex-direction
- следующая страница flex-grow