#flex-basis

#介绍

flex-basis 指定了弹性项目在主轴方向上的初始大小。这个属性就决定了弹性项目的边框区域（border area）的尺寸。 当一个元件同时被设置了 flex-basis (除值为 auto 外) 和 width (或者在 flex-direction: column 情况下设置了 height)，flex-basis 具有更高的优先级。

#使用示例

css-apisrc/flex-basis/App.tsx

预览

#语法

/* Specify <'width'> */
flex-basis: 10em;
flex-basis: 3px;
flex-basis: 50%;
flex-basis: auto;

#取值

• auto

  默认值。参照自身的 width 和 height 属性。

• <length>

  绝对尺寸大小。

• <percentage>

  一个相对于其父弹性容器主轴内容区域（content area）的百分数。

#形式定义

#形式语法

flex-basis = auto | <length-percentage [0,∞]>

<length-percentage> =
  <length>      |
  <percentage>

#与 Web 的区别

• 值不受 box-sizing 影响。

#兼容性