html - 用于删除 Angular 材质 v5 模态背景的 CSS 代码

Question

我想删除模态框上的背景，我知道打开模态框时有一个 hasBackdrop 属性，但我只想根据模态框上发生的某些条件隐藏背景。所以我想我可以用 css 做到这一点，但是在检查模式上的元素后，我找不到任何与背景 css 相关的东西。

标签： htmlcssangularangular-material-5

Answer 1

我完全不明白这个问题。

如果您需要删除对话框的阴影框，只需找到包含您需要处理的对话框的组件，找到它的样式文件并添加以下内容：

/deep/.mat-dialog-container {
  box-shadow: none;
}

更多关于使用的信息deep可以在angular 文档和更多使用示例（stackoverflow 的问题）和angular 的博客网站上找到。

如果您在这里需要的是移除背景，那么请事先创建一个类

.no-backdrop {
  background: none;
}

并将其添加到用于创建对话框的函数中：

this.dialog.open(LoaderComponent, {
  backdropClass: 'no-backdrop',
});

您也可以将false值添加到字段中，hasBackdrop例如：

this.dialog.open(LoaderComponent, {
  hasBackdrop: false
});

默认情况下，该值为 true。

更多信息可以在angular material v5的网页上找到。

希望它可以帮助某人。