减少 Angular Material Card 的 3D 效果？答案

【问题标题】：Reduce 3D effect from Angular Material Card?减少 Angular Material Card 的 3D 效果？
【发布时间】：2018-04-14 11:13:48
【问题描述】：

我在 Angular-Material 中设计了 this layout。是否可以通过减少 z-index 来reduce the 3D effect。最终将其缩小到以下效果。

    <div style="border: 1px">
        ... box content
    </div>

我尝试操作容器类的 z-index，但收到无效属性值错误。

.mat-drawer-container
{ 
    z-index: 1 
}

附：不幸的是，由于布局中断，无法删除材料卡并用 Div 替换它。因此寻找黑客攻击。

【问题讨论】：

【解决方案1】：

只需将mat-elevation-z{X} 添加到您的卡片类中，其中{X} 从 1 变为 24，表示它与 z=0 相比的提升程度；

【讨论】：