在 flex 容器里的项目可以很容易去改变它们的顺序，而且不需要修改 html 代码 .. 默认这些项目的顺序就是添加它们的 html 代码的顺序， 1 就是排在第一 .. 最后这个是 5 ..

打开浏览器的开发者工具 .. 选中在 flex 容器里的一个项目 .. 打开 Computed 这个选项卡 .. 勾选一下 Show inherited properties ..

在这里找到 order 这个属性 .. 它的值是 0 .. 这个 order 属性可以控制项目在 flex 容器里的顺序 .. 回到编辑器 ..

比如我想让 1 这个项目排在所有这些项目的最后 .. 因为所有项目默认 order 属性的值都是 0 ，所以如果我把它设置成 1 的话，就会让这个项目排在最后 .. order: 1 ..

你会看到， 1 这个项目会在最后 .. 如果我想让 5 这个项目排在这些项目的最前面 .. 在这个项目的容器上，同样使用一个 order 样式 .. 可以把它的值设置成 -1 ，因为 -1 小于 0 ，这样它就会排在所有项目的最前面 ..

order 值是 -1 的项目排在最前面， 然后是 2，3，4 。它们的 order 属性的值都是默认的 0 ，所以它们的顺序就是 html 代码的顺序 .. 最后是 order 的值是 1 的这个项目 ..