Flexbox布局中的Order属性

Question

我正在本网站http://flexboxfroggy.com/上使用Flexbox布局进行培训。订单属性有一点我不明白：

想象一下，我已经有了这个

然后我申请顺序：1;属于黄蛙的财产。

为什么那两个小人在一起？我不希望这种行为。我以为他们会向右前进一步，但不是那样的吗？

有人可以向我解释一下吗？

Answer 1

所有弹性项目的order属性的初始值为0。

当您将order: 1应用于项目时，它会将所有其他项目移到前面。

从图像中的代码可以看出，这两只黄色的青蛙最初位于顶行的空绿色圆圈中。那是他们的初始位置。然后align-self: flex-end将它们移动到容器的底部。

如果我们忘记align-self: flex-end一秒钟，order: 1会将这些青蛙移到顶行的末尾。现在回来align-self: flex-end。

以下是order属性的详细说明：https://stackoverflow.com/a/36118012/3597276