在 flex 容器上,可以使用一个 flex-direction 属性来控制它里面的项目的排列方式 .. 这个属性设置的是容器的 main axis ,也就是主轴的方向 .. 有两个主要的方向,一个是 row ,水平方向 .. 还有一个是 column,垂直的方向 ..
在这个 container 里面,再用一个 flex-direction .. 它的值先设置成 row .. row 就是行 .. 也就是水平方向 .. row 是 flex-direction 的默认的值 .. flex 项目会水平从左向右排列 .. 我们可以让它们倒过来排列 .. 方向仍然是 row .. 不过在它后面加上一个 reverse .. 表示倒置 ..
现在项目会在容器主轴的右边,向它的左边排列 ..
下面再试一下 column 这个方向 .. 把这个 reverse-row 换成 column .. 现在项目会垂直堆叠在一起,从上往下排列 .. 同样这个方向也可以倒过来 .. column-reverse ..