angular-material2工具栏阴影

Question

我是material2的新手  我试图保持主要的应用程序工具栏固定在屏幕的顶部问题是高程不正常（内容隐藏工具栏的阴影）我 这是我的HTML代码

.app-content {
  height: calc(100% - 64px);
  overflow: auto;
}

<md-toolbar class="mat-elevation-z5" color="primary" style="z-index: 100!important;">

  <button md-icon-button (click)="start.open()">
      <md-icon class="demo-toolbar-icon">menu</md-icon>
    </button>
  <span>E-Learning</span>

  <span class="demo-fill-remaining"></span>
</md-toolbar>
<div class="app-content" style="z-index: 0!important;">
  <div class="workspace">
    <el-teacher></el-teacher>
  </div>
</div>

Answer 1

您必须为元素提供位置相对/绝对/固定/静态才能使z-index正常工作。

.mat-elevation-z5 {
   position: relative;
   z-index: 2;
}