css - CSS：试图测试 flex-shrink 的行为，但看不到它的工作原理

Question

我连续有 3 个弹性盒子。在第一个，类.one，我有flex: 1 1 400px。我认为这将允许设置为 400px 的框能够缩小，但是当我降低屏幕宽度时它保持在 400px。
当我这样做时，我也没有看到任何区别flex: 1 0 400px。

div.cont {
  display: flex;
  width: 100%;
}

div > div {
  height: 90px;
  width: 90px;
  background: green;
}

.one {
  background: green;
  flex: 1 1 400px;
}

.two {
  background: blue;
  flex: 1;
}

.three {
  background: pink;
  flex: 1;
}

<div class="cont">
  <div class="one"></div>
  <div class="two"></div>  
  <div class="three"></div>  
</div>

标签： cssflexbox