Angular 材料-垫台

Question

我正在使用 angular 材料，我一直在尝试为 mat-table 设置一些样式，但没有成功。 我需要更改表格本身的边框半径，还需要将表格内的间距更改为“空间之间”。我非常需要这个设计：设计

谢谢！

Answer 1

您已添加以下 css 更改：-

.mat-table {
  overflow: auto;
  max-height: 500px;
  border-radius: 10px;  // this change
}

.example-container{
  border-radius: 10px; // this change
}

Answer 2

首先，您需要检查是否为 mat-table 应用了边框样式。 据我所知，mat-table 默认情况下不添加边框。 如果不是，请添加边框样式并为使 CSS 适用，您需要在 css 文件中的 class 名称之前使用/deep/ 。

/deep/ .mat-table {
            border: 1px solid;
            border-radius: 30%; 
        }

或者你可以添加

  encapsulation: ViewEncapsulation.None,

在您的 component.ts 作为@component装饰器中的参数。