调整大小时 div 的 Flexbox 切换顺序

Question

我在 Angular 中查看关于 Flexbox 的 demo，我注意到在调整大小时，second-section 低于 first-section。有什么方法可以让它位于 first-section 之上（在调整大小时），而不修改 html?

谢谢。

Answer 1

在上面的例子中它改变了因为 fxLayout="row" 和 fxLayout.xs="column"

要自定义更改顺序，您需要 fxFlexOrder

<div fxFlexOrder='1' fxFlexOrder.xs='3'></div>
<div fxFlexOrder='2' fxFlexOrder.xs='2'></div>
<div fxFlexOrder='3' fxFlexOrder.xs='1'></div>

Flexbox switching order of divs on resize