html 部分
<body>
<div class="box">
<div class="item a1">不放大不缩小</div>
<div class="item a2">会放大会缩小</div>
<div class="item a3">不放大不缩小</div>
</div>
css部分
.box{
display: flex;
height: 100px;
}
.item{
width: 200px;
}
.a1{
background-color: green;
flex-shrink: 0;
}
.a2{
background-color: yellow;
flex-grow: 1;
}
.a3{
background-color: blue;
flex-shrink: 0;
}
![](https://i-blog.csdnimg.cn/blog_migrate/2a646c1c4ca383cc2c8d258a7924621c.png)