分类导航

HTML 发布时间：2022-04-14 发布网站：大佬教程 code.js-code.com

大佬教程收集整理的这篇文章主要介绍了html – 将Angular Material Dropdown菜单移到左侧，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

我正在使用Angular Material.我已经成功创建了一个导航栏和一个下拉菜单.

我想将DROPDOWN移到左侧.现在,它出现在中心周围.

<md-toolbar layout="row" class="md-whiteframe-z3" style="padding: 0px;margin:0px;float: left;">
    <h2>Material NavBar</h2>
    <md-menu>
        <md-button md-menu-origin ng-click="$mdopenMenu()">Dropdown</md-button>
        <md-menu-content width="2">
            <md-menu-item>
                <md-button>Help</md-button>
            </md-menu-item>
            <md-menu-item>
                <md-button>About</md-button>
            </md-menu-item>
        </md-menu-content>
    </md-menu>
    <md-button aria-label="Go BACk">
        Go BACk
    </md-button>
    <md-button>Item 1</md-button>
    <md-button>Item 2</md-button>
</md-toolbar>

如何修改代码以将DROPDOWN移动到文本Material NavBar旁边的左侧？

解决方法

@H_772_17@ 你只需要添加< span flex> < /跨度>在你的代码中.

<md-toolbar layout="row" class="md-whiteframe-z3" style="padding: 0px;margin:0px">
<h2>Material NavBar</h2>
<md-menu>
    <md-button md-menu-origin ng-click="$mdopenMenu()">Dropdown</md-button>
    <md-menu-content width="2">
        <md-menu-item>
            <md-button>Help</md-button>
        </md-menu-item>
        <md-menu-item>
            <md-button>About</md-button>
        </md-menu-item>
    </md-menu-content>
</md-menu>
<span flex></span>
<md-button aria-label="Go BACk">
    Go BACk
</md-button>
<md-button>Item 1</md-button>
<md-button>Item 2</md-button>

这是一个有效的例子.
http://codepen.io/next1/pen/RaYNxw