flex-basis属性定义了在分配多余空间之前,项目占据的主轴空间(main size)。
浏览器根据这个属性,计算主轴是否有多余空间。它的默认值为auto,即项目的本来大小。
.item { flex-basis: <length> | auto; /* default auto */ }
它可以设为跟width或height属性一样的值(比如350px),则项目将占据固定空间。
尝试百分比的设置
<view class='c01'>
<view class='fk'>01</view>
<view class='fk c02'>02</view>
<view class='fk'>03</view>
</view>
.c01{
display: flex;
}
.fk{
width: 100px;
height: 100px;
background-color: gainsboro;
margin: 5px;
}
.c02{
flex-basis: 200px;
}
效果图