Html 如何在“移动”视口中将flex box导航拆分为两行

当在移动屏幕上看到这一点时，我想将顶部导航栏分成两行，即

@媒体屏幕和（最大宽度：480px

这是我的小提琴

。索引导航{显示：-ms flexbox；
/*显示：-webkit内联框；
显示器：-moz盒；
显示：-ms flexbox；
显示：-moz flex；
显示：-webkit flex*/
显示：-网络工具包盒；
-webkit盒包：证明；
显示：flex；显示：-ms flexbox；}

一种可能的方法是将列表分成两部分

Mobile viewport可以得到一个

flex-direction:column

，任何比它宽的东西都可以得到

flex-direction:row

查看示例：

可能重复的