Properties

Properties

Editing
  • account_tree
  • bug_report

flex-flow

flex-directionflex-wrap 속성을 한번에 지정하는 축약식 속성이다.

사용 가능한 값 타입

〈'flex-direction'〉

  • row | row-reverse | column | column-reverse

사용되는 키워드

  • column

    플렉스 컨테이너의 주축은 현재 writing-mode의 블록축과 같은 방향이다. main-start 및 main-end 방향은 각각 현재 writing-mode의 블록 시작 및 블록 종료 방향과 동일하다.

  • column-reverse

    column과 동일하나 main-startmain-end 방향이 바뀐다.

  • row

    플렉스 컨테이너의 주축은 현재 writing-mode의 인라인 축과 같은 방향이다.

  • row-reverse

    row와 동일하나 main-startmain-end가 바뀐다.

〈'flex-wrap'〉

  • nowrap | wrap | wrap-reverse

사용되는 키워드

  • nowrap

    플렉스 레이아웃 항목들이 한 줄로 나열된다.

  • wrap

    플렉스 레이아웃 항목들을 필요하다면 여러 줄에 걸처 나열한다.

  • wrap-reverse

    wrap과 동일하나 순서가 역순으로 나열된다.

구문

  • 〈flex-direction〉 || 〈flex-wrap〉
  • object.style.flexFlow = "column nowrap";CSS3

    자바스크립트 형식

테스트 도구

flexible 레이아웃을 위한 flex-flow 속성 테스트

지원 웹브라우저