我正在使用Angular-Material并实现了SideNav菜单.当屏幕尺寸较小时,菜单将被隐藏,当单击菜单切换按钮时,菜单将从左侧滑出,整页高度.当屏幕较大时,菜单显示在左侧,但不在整页高度.
如何使固定菜单显示为整页高度.我一直在玩css和其他md属性,但只是无法找出方法.
<div ng-controller="appCtrl" layout="vertical" layout-fill>
<md-toolbar class="md.medium-tall app-toolbar">
<div class="md-toolbar-tools" ng-click="toggleMenu()">
<button class="menu-icon" hide-sm aria-label="Toggle Menu">
<md-icon icon="img/icons/ic_menu_24px.svg">
<object class="md-icon" data="img/icons/ic_menu_24px.svg"></object>
</md-icon>
</button>
<h2>
<span>Dev.Material</span>
</h2>
</div>
</md-toolbar>
<section layout="horizontal" flex>
<md-sidenav class="md-sidenav-left md-whiteframe-z2" component-id="menu" is-locked-open="$media('sm')">
<md-toolbar md-theme="purple">
<h1 class="md-toolbar-tools">Sidenav Left</h1>
</md-toolbar>
<md-content class="md-padding" ng-controller="menuCtrl">
<p>
This sidenav is locked open on your device. To go back to the default behavior,
narrow your display.
</p>
</md-content>
</md-sidenav>
<md-content flex class="md-padding">
Some content !!
</md-content>
Run Code Online (Sandbox Code Playgroud)
和控制器:
(function () {
'use …Run Code Online (Sandbox Code Playgroud)