flex标签到底意味着什么？

Question

我想知道flex标签在css中的含义。几天前我用它做了一些定位，但我想知道它究竟是做什么的。

我已经搜索了一些解释和想法，如W3和W3schools，但不仅仅是这些。那里的一切都是一样的。

  

首字母：1 0 auto

大多数解释都是不可取的，但我似乎无法找出“1 0 auto”的含义。就像现在我仍然认为它是一个布尔值1 =是/ 0 =否但是有人可以解释一下flex标签实际上做了什么吗？

我已经在CSS中使用它了

.flextest {
   width: 100%;
   height: 100%;
   display: flex;               <---
   align-items: center;
   position: relative;
   top: -81px;
}

这适用于我的问题，但我不确定我在这里做了什么。

这不是问题。因此，这将是讨厌的，或者这对社区来说是一个很好的补充。如果这不属于这里，我很抱歉。我把它看成是一个编程问题。

Answer 1

以这种方式初始化flex {{1}}意味着您要为flex属性设置特定值。

`/* this is equivalent */
    flex: 1 2 10%; 

    /* to this */
    flex-grow: 1;
    flex-shrink: 2;
    flex-basis: 10%;

这只是一种速记方式。

Answer 2

您可以先了解弹性容器和物品之间的区别。

display: flex创建 flex容器。

  

flex容器是由具有计算的元素生成的框   flex或inline-flex的显示。 Flex容器的流入子代   被称为弹性项目，并使用flex布局模型进行布局。   <子> Source

然后，您可以通过设置各种属性或使用允许增长，缩小和基础值的flex shorthand property来自定义 flex项在容器中的行为方式集。

  

现在我仍然认为它是布尔值1 =是/ 0 =否

正确，1 =是，0 =否。

因此flex: 1 0 auto（初始值）指定Flex项目应该增长而不是缩小，并使用auto size basis进行调整。