Question

我想使用角度材质实现基于按钮的选项卡。我尝试应用课程和其他内容。但是，它没有用，找不到方法。

我正在遵循有角度的材料指南：https://material.angular.io/components/tabs/examples

<mat-tab-group>
  <mat-tab label="First"> Content 1 </mat-tab>
  <mat-tab label="Second"> Content 2 </mat-tab>
  <mat-tab label="Third"> Content 3 </mat-tab>
</mat-tab-group>

是否可以为第一个，第二个和第三个标签放置普通按钮？我想要实现以下内容：https://imgur.com/0rb5d5f 我am了三个多小时。谢谢！

Answer 1

您可以更改mat-tab-label的样式。

在style.css中添加（不在CSS组件中）：

.mat-tab-label
{
//personal css style
}

（示例）

.mat-tab-label{
 background-color: #4CAF50;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;

}

https://material.angular.io/guide/customizing-component-styles

角度垫标签中的实施按钮

1 个答案: