【问题标题】:How can I center tab labels in `mat-tab-group` (Angular-Material)?如何在“mat-tab-group”(Angular-Material)中居中标签标签?
【发布时间】:2018-10-17 15:37:03
【问题描述】:

我有这个mat-tab-group,它只有两个标签。 mat-tab-group 容器元素宽度大于两个选项卡标签的组合宽度,我想将标签居中或增加宽度以使它们看起来更干净。提前谢谢。

        <mat-tab-group>
            <mat-tab label="Person">
                <ng-template matTabContent>
                    <person-register></person-register>    
                </ng-template>
            </mat-tab>
            <mat-tab label="Company">
                <ng-template matTabContent>
                    <company-register></company-register>
                </ng-template>
            </mat-tab>
        </mat-tab-group>

【问题讨论】:

  • 你不能展示一些代码示例吗?
  • 建议 Marshal 的 mat-stretch-tabs 工作正常!但我还是编辑了答案。

标签: css angular angular-material


【解决方案1】:

如果您添加 mat-stretch-tabs 应该将标签拉伸到容器的宽度并将标签标签居中。

<mat-tab-group mat-stretch-tabs></mat-tab-group>

【讨论】:

    【解决方案2】:
    <mat-tab-group mat-align-tabs="center"></mat-tab-group> 
    

    【讨论】:

    • 虽然接受的答案是好的答案,但这是正确的答案
    • 优秀。非常感谢。
    猜你喜欢
    • 2018-01-18
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-02-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-10-16
    相关资源
    最近更新 更多