UPDATED ANSWER
From the official documentation:
Styling overlay components
Overlay-based components have a panelClass
property (or similar) that can be used to target the overlay pane.
You can override the default dialog container styles by adding a css class in your global styles.css
. For example:
.custom-dialog-container .mat-dialog-container {
/* add your styles */
}
After that, you'll need to providies you css class as a panelClass
parameter to your dialog:
this.dialog.open(MyDialogComponent, { panelClass: 'custom-dialog-container' })
Read this official documentation for more information.
ORIGINAL ANSWER
Use ::ng-deep
in your component.css to override the default styles.
::ng-deep .cdk-overlay-container {
/* Do you changes here */
position: fixed;
z-index: 1000;
}
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…