flex：none和flex：0 0移动之间的逻辑差异100％

Question

该图块的外观与所有图块相同，但我想知道使用flexbox属性设置100％的图块宽度在逻辑上是正确的。 flex：none或flex：0 0 100％，因为根据bootstrap4网格系统，他们使用flex：0 0 100％;

img {
  border: 0;
  vertical-align: middle;
  height: 180px;
  overflow: hidden;
  position: relative;
  display: block;
  width: 100%;
}

.flex {
  display: flex;
}

.flex div {
  border: 1px solid;
  max-width: 299px;
}

.auto {
  flex: 0 0 auto;
}

.hund {
  flex: 0 0 100%;
}

.none {
  flex: none;
}
 @media (min-width: 768px) {
  .flex div {
    flex: 0 0 33.3333333%;
    max-width: 33.3333333%;
    
  } 
 }

<div class="flex">
  <div class="auto">
    <img src="https://via.placeholder.com/340x230"> This is flex-basis auto
  </div>
</div>
<div class="flex">
  <div class="hund">
    <img src="https://via.placeholder.com/340x230"> This is flex-basis hund
  </div>
</div>
<div class="flex">
  <div class="none">
    <img src="https://via.placeholder.com/340x230"> This is flex-basis none
  </div>
</div>
<div class="flex">
  <div class="pointless"><img src="https://via.placeholder.com/340x230"> This is flex-basis pointless
  </div>
</div>