angular – 你如何使用material2卡中的mat-card-header-text处理

发布时间：2020-12-17 08:33:52 所属栏目：安全来源：网络整理

导读：我似乎无法将这个容器包裹在md卡中. 在我的材料卡片中,我有这个： div class="mat-card-header-text" /div 我见过别人注意到了.它会在我的标题左侧产生40px的空间.没有CSS似乎也会影响它. 我正在使用Angular 4.x和Material2. 这个额外的div实际上很烦人.事实

我似乎无法将这个容器包裹在md卡中.

在我的材料卡片中,我有这个：

<div class="mat-card-header-text"> </div>

我见过别人注意到了.它会在我的标题左侧产生40px的空间.没有CSS似乎也会影响它.

我正在使用Angular 4.x和Material2.

这个额外的div实际上很烦人.事实证明,您可以使用阴影穿孔为其应用样式而无需更改CSS仿真模式.你可以使用:: ng-deep组合器这样做：

::ng-deep .mat-card-header-text {
  /* CSS styles go here */
  margin: 0px; // for example to remove the margin
}

您也可以使用自己的CSS类替换整个标头：

<mat-card>
  <div class="your-header">
    <div class="your-title">
      Your title here
    </div>
  </div>
  <mat-card-content>
    Stuff goes here
  </mat-card-content>
</mat-card>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!