代码之家  ›  专栏  ›  技术社区  ›  Chatra

Mat工具栏内容对齐MNET

  •  0
  • Chatra  · 技术社区  · 7 年前

    在本例中,我希望内容左右对齐。

    https://material.angular.io/components/toolbar/examples

    我想要左边的图标,中间的文本,右边的用户名。

    我该怎么做?

    1 回复  |  直到 7 年前
        1
  •  5
  •   Marshal    7 年前

    您可以执行以下操作来完成此任务。

    移动 mat-icon 把它放在容器的顶部。

     <mat-toolbar-row>
       <mat-icon class="example-icon">verified_user</mat-icon>
    

    申请 example-spacer

    <span class="example-spacer">Second Line</span>
    

    将以下内容添加到 示例垫片 上课 toolbar-multirow-example.css

    text-align: center;
    

    之后是用户名

    <span>User Name</span>
    

    闪电战

    https://stackblitz.com/edit/angular-tesmev?embed=1&file=app/toolbar-multirow-example.html