flex布局中flex-basis属性

该属性的取值

1. 数值、百分比
2. auto
3. content

数值、百分比

指定数值、百分比，该元素的宽度为指定宽度
flex-basis: 200px;
flex-basis: 50%;

auto

指定auto，该元素的宽度为自身的width属性宽度，如果没有设置width，则为内容撑开的宽度
flex-basis: auto;

content

指定content，该元素的宽度为内容撑开的宽度，它和auto不一样，auto会优先读取width，如果没有设置width属性，元素的宽度才为内容撑开的宽度

flex-basis的优先级比width高

.flex-item {
    width: 200px;
    flex-basis: 300px;
    // 元素的最终宽度会为300px
}

.flex-item {
    width: 200px;
    flex-basis: content;
    // 元素的最终宽度会为内容撑开的宽度，而不是200px
}