我想go 掉角material 模式对话框中的空白.如何设置CSS样式,使我看不到任何白色?到目前为止我的CSS:

app-commission-me-dialog {
    margin: 0px;
    padding: 0px;
}

.mat-dialog-container {
    margin: 0px;
    padding: 0px;
}

推荐答案

Updated Answer

根据官方文件:

Styling overlay components

基于覆盖的组件有一个panelClass

通过在全局应用程序中添加css类,可以覆盖默认的对话框容器样式.例如:

.custom-dialog-container .mat-dialog-container {
    /* add your styles */
}

之后,您需要将CSS类作为100参数提供给您的对话框:

this.dialog.open(MyDialogComponent, { panelClass: 'custom-dialog-container' })

链接到StackBlitz Demo.更多信息,请阅读本official documentation.


Original Answer

使用ViewEncapsulation可以用样式替代默认样式.

在打开对话框的组件中,执行以下更改:

import {ViewEncapsulation} from '@angular/core';
    
@Component({
  .....,
  encapsulation: ViewEncapsulation.None 
})

在该组件的css文件中,添加以下类:

.mat-dialog-container {
    padding: 0px !important;
}

这里是Plunker Demo的链接.

Angular相关问答推荐

Angular 16路卫单元测试可观察到的SpyObj属性

Angular前端调用ALB身份验证后的后端并重定向

以Angular 表示显示特殊字符

垫-菜单未以17.2.3角显示

尽管有模拟间谍实现,规范文件仍调用真正的服务

将输入传递到组合Angular指令

成Angular 的嵌套router-outlet

Angular 17多内容投影错误

自定义垫日历中选定的日期(Angular material )

在switchMap操作符中使用条件语句以进行第一次或随后的执行

Angular 13 Sass 模块无法在编译中正确导入文件

Angular 无法从后端获取数据到前端

如何在对话框angular material内对齐按钮?

无法获得 angular-material md-sidenav 的 100% 高度

Angular 5 Mat-grid 列表响应式

错误 TS1086:无法在 Angular 9 的环境上下文中声明访问器

Mat-autocomplete - 如何访问选定的选项?

Angular 2+ ngModule 中导入/导出的作用

Angular 应用程序必须在新部署后清除缓存

ng build 时超出调用重试次数异常