Flex项目是否认为是块级项目？

Question

上周我一直在研究Flex Box布局方法，但我觉得自己无法转过头。我要直达重点。

让我们看一下这种情况

.container{
  display:flex;
}
 
 .container div{
  border:2px solid red;
  background: peachpuff;
  height:50px;
  flex: 1;
 }

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

在这里，我们在一个Div容器内有3个DIVS项目。我们对他们应用了一定的高度和 flex：1 属性，这意味着物品将在其容器内生长，高度为50px，它们将从0的挠性基础开始

。我们将.Container规则更改为：

.container{
  display:flex;
  flex-direction: column;
}
 
 .container div{
  border:2px solid red;
  background: peachpuff;
  height:50px;
  flex: 1;
 

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

我们添加了 flex方向：列; 属性，但我们不会更改另一个规则的任何内容，这意味着应用相同的高度和flex：1属性仍然应用。现在我们的Divs会崩溃，因为即使认为柔性生长因子为1，flex-Basis设置为0。

我认为我不明白，在两种情况下，我们都有空的divs，在两种情况下，我们都申请了相同的挠性：1属性，将 flex-Basis自动设置为0 。在第一个示例中，将创建3个框，它们将在容器中共享相同的空间（甚至认为它们没有HTML内容），而在第二个示例中，这些框将崩溃，我们将看到边框。

我唯一能想到的解释是，这些divs（没有内容）被视为块级元素及其内容盒宽度的值（以某种方式？）给出了一个不是0的值Flex Grook的起始基础），但高度值设置为0（因此将作为Flex Grow属性的起始基础，使一切崩溃）。

但是，这些物品如何在同一时间处于弹性级别和块级？如果他们处于块级，那么为什么如果我们创建此代码：

.container{
  display:flex;
}

.container div{
  border:2px solid red;
  background: peachpuff;
  height:50px;
}

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

这些项目不会被视为块级项目，因为它们之间不会创建新的线路，并且它们不会将其宽度扩展到容器。

对于一个漫长的问题，我深表歉意，希望我足够清楚，希望有人能澄清我的dobuts！