css - Angular 7 - 如何根据窗口大小处理两个不同的导航栏？

我想我的问题很简单，

我在一个项目的开始，我刚刚完成了 Sidenav（位于屏幕左侧），我实际上将它用作组件。当窗口较小时，我想使用“普通”顶部导航栏，但我不知道如何实际实现这一点。顶部导航栏是否需要另一个组件？如果是这样，我如何根据窗口大小在这两个之间切换？

顺便说一句，我使用 Materialize CSS...

标签： cssangularmaterial-designresponsive

我有一个类似的问题。当我在 Angular 中创建简历时，我想显示mat-horizontal-stepper屏幕何时大于 700 像素，mat-vertical-stepper何时小于它。所以我创建了一个HostListenertowindow:resize事件。