代码之家 › 专栏 › 技术社区 › Ian Vink

垫子图标右侧填充?棱角材料

mat-icon angular-material angular

0

Ian Vink · 技术社区 · 4 年前

角度材质图标:

我有一个 mat图标 我想在文本旁边。我所做的一切都不会减少图标和文本之间的空间。

基于此HTML:

      <span>
        <mat-icon [inline]="true" style="display:inline;">locked</mat-icon>
        <span AMELIA SMITH</span>
      </span>

1 回复 | 直到 4 年前

1

0

JSmith 4 年前

删除内联并添加自定义css以对齐文本,当前值不准确,但您可以更改它们

在CSS中:

mat-icon {
  vertical-align:middle;
}

.a {
  padding-top:8px;
  vertical-align:middle;
}

mat-icon {
  vertical-align:text-bottom;
}

html格式:

<span>
  <mat-icon >locked</mat-icon>
  <span class="a"> AMELIA SMITH</span>
</span>