Css 如何使这个部分可折叠的导航栏显示我想在Bootstrap4上显示的项目？

我试图让引导4导航条只部分崩溃

基本上，我希望一些向右对齐的项目始终可见，而如果您尝试在手机上打开网站，左侧的大多数导航栏项目将折叠成菜单

问题是，当您展开该菜单时，折叠的元素显示在固定菜单之前，正如您所期望的那样，但出于明显的美学原因，我希望它们显示在下面

工作示例：

扩展时的预期结果：

访问折叠项时的预期结果：

---

我一直在玩元素的配置以及尝试浮动正确和浮动正确，但它被证明是无效的，我不知道如何继续这样做，而不为我提供的基础引导的急剧变化。有什么想法吗？

如果在HTML中的导航栏折叠div之前向上移动导航栏标题div，它将起作用。然后，对于大于中等大小的文件，只需使用将导航栏标题向右移动即可。

我不知道CSS属性，这非常有效。此外，引导程序似乎有一个特定于应用顺序的类：仅当菜单未折叠时才应用顺序1，称为order-md-1。对了，Bootstrap有那个助手类。请记住，order属性用于flexbox子项。