AngularJS菜单布局桌面和移动响应

Question

我有这个菜单的AngularJS网站

但这是在移动中加载时发生的情况

我可以在手机上实现这样的布局吗？

这是HTML代码

    <div flex="nogrow">
        <div layout="row" layout-align="end center">
            <div class="dashboard-button-right pointer" ng-repeat="btn in dashboardButtons" ng-click="dashboardClick(btn, $event)" 
                 ng-class="{'{{btn.active_class}}': btn.active === true, '{{btn.class}}': btn.active === false}">
              {{btn.label}}
            </div>
        </div>

    </div>

谢谢你

Answer 1

您可以使用媒体查询，还可以提及bootstrap xs列。如果你在xtra小屏幕上做出响应，你需要使用bootstrap列进行对齐，然后你可以使用css媒体查询来设置它们的样式。事实上，对于响应式网站，您需要定义其行为并将其对齐所有4个屏幕（lg，md，sm，xs）。

我假设你已经知道了bootstrap网格系统。我希望它能解决你的问题，如果你需要问一些事情让我知道。