控制垫片的高度答案

【问题标题】：Controlling the height of a mat-chip控制垫片的高度
【发布时间】：2021-08-07 17:07:31
【问题描述】：

如何改变棱角材料芯片的高度？

<mat-chip-list>
  <mat-chip>Example</mat-chip>
</mat-chip-list>

默认实现将最小高度设置为 32 像素

【问题讨论】：

body .mat-standard-chip { min-height: 40px !important} 放到主css文件中
@SonNguyen 您的评论将不允许用户有选择地在某些地方有全高的垫子，而在其他地方有其他高度的垫子。
哦，没想到你只想设置一个芯片。如何在您的芯片容器元素周围应用样式并像.short-chip .mat-standard-chip 一样引用它？需要检查 Mat 生成的实际标记以找到正确的选择器

【解决方案1】：

mat-chip 默认有min-height: 32px 和height: 1px。如果mat-chip 下的文本/段落较长，您将仅收到默认的min-height: 32px。

所以你可以通过将其设置为auto来控制高度，如下所示，在您的 CSS 中，

.mat-standard-chip {    
   height: auto !important;
 }

如果您想使用具有类名/ ID 的特定芯片，您可以使用具有一些像素的相同高度属性。示例：

.small-chip {
   height: 20px !important;
}

【讨论】：

【解决方案2】：

您可以使用以下属性：

.mat-standard-chip {
   min-height: 22px !important;
}

【讨论】：