[英]Angular 10 : mat-elevation-z is not working for any component
I'm using the class mat-elevation-z4 in a mat-toolbar e mat-card elements, and it simply doesn't work.我在 mat-toolbar e mat-card 元素中使用 class mat-elevation-z4,它根本不起作用。 Even if I don't apply any other CSS in those elements.即使我不在这些元素中应用任何其他 CSS。
The versions:版本:
Angular CLI: 10.0.6 Angular CLI:10.0.6
Node: 10.14.2节点:10.14.2
OS: win32 x64操作系统:win32 x64
Angular: 10.0.9 Angular:10.0.9
The application is running in Chrome desktop, and I've tried in Firefox also.该应用程序在 Chrome 桌面上运行,我也在 Firefox 中尝试过。
I used this to try to fix: but it only worked in toolbar and generated other bugs:我用它来尝试修复:但它只在工具栏中工作并产生了其他错误:
.antiBug {
position: relative;
z-index: 2;
}
My mat-card:我的垫卡:
<mat-card class="mat-elevation-z4">
<mat-card-title class="title">Bem vindo!</mat-card-title>
<mat-card-subtitle class="subtitle">
Sistema para exemplificar a construção de um cadastro em Angular
</mat-card-subtitle>
</mat-card>
I don't want to blindly install older versions of Angular in the hope that the problems disappears.我不想盲目安装旧版本的Angular,希望问题消失。
How can I fix this?我怎样才能解决这个问题?
PS: coincidentally, in the same project I have material buttons, and their styles are working, EXCEPT the mat-rised-button, which is "3D" to. PS:巧合的是,在同一个项目中,我有材料按钮,它们的 styles 正在工作,除了垫升按钮,它是“3D”到的。 It looks like Angular is having some problem to control z-index...看起来 Angular 在控制 z-index 时遇到了一些问题......
Look at the class mat.elevation-z8 of my tool-bar看看我的工具栏的 class mat.elevation-z8
And here, the same of my mat-card在这里,和我的垫卡一样
I had a similar problem, but it turns out that when I did install the Angular Material, it does not added "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css" to my angular.json style section, inside the build section.我有一个类似的问题,但事实证明,当我安装 Angular 材料时,它没有将“./node_modules/@angular/material/prebuilt-themes/indigo-pink.css”添加到我的angular.Z6466DEEC16ECDF24.D6466DEEC16ECDF24.Z6466DEEC16ECDF24.Z6466DEEC7F6ECDF245 ,在构建部分内。
Style section of the angular.json file angular.json 文件的样式部分
After adding this code, it's working fine!添加此代码后,它工作正常!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.