Properties

Properties

Editing
  • account_tree
  • bug_report

flex-basis

유연한 레이아웃 항목의 가로 길이를 설정한다. 기본 값은 컨테이너 내 내용의 크기에 따른다.

설명

가로 크기를 지정하는 width와 동일하게 보이지만 flex-basis 다음과 같은 차이점이 갖는다.

  • flex 항목에서만 적용된다.(width는 무시된다.)
  • 다른 flex 항목과 유기적인 관계를 갖는다.
  • flex 주축에서만 작동한다. flex-direction 속성에 의해서 flex 항목의 배치 방향이 바뀌면 width 속성이 다른 역할을 한다.
  • 절대위치에 있는 flex 항목에는 영향을 주지 않는다.

사용 가능한 값 타입

〈'flex-basis'〉

  • auto | content | <length-percentage>

사용되는 키워드

  • auto

    자신의 widthheight 속성 값을 사용한다.

  • content

    콘텐츠의 크기에 따라 자동으로 계산한다.

사용되는 타입

아래 유형에서 지원하는 모든 키워드와 단위를 사용하지 않을 수도 있다. 값 사용에 대한 자세한 사항은 아래 값 항목을 참고하라.

다음은 필요에 따라 일부 값을 설명하므로 표시되지 않는 값은 값 유형을 참조하라.

  • 〈flex-basis〉autoCSS3

    기본 값. 컨테이너 내 내용의 크기에 따른다.

구문

  • flex-basis 〈flex-basis〉;CSS3
    flexible 레이아웃을 위한 flex-basic 속성
  • object.style.flexBasis = "200px";CSS3Unapplied
    자바스크립트 형식

지원 웹브라우저