Question

我已经从cli创建了离子项目。离子版本是3.我试图在中心制作标题图像。有人请帮帮我

<ion-menu [content]="content">
  <ion-header>
    <ion-toolbar color='primary'>
      <ion-title>
        <img src="assets/imgs/logo.png" width="128" />
      </ion-title>
    </ion-toolbar>
  </ion-header>
  <ion-content>
    <ion-list>
      <button menuClose ion-item *ngFor="let p of pages" (click)="openPage(p)">
        {{p.title}}
      </button>
    </ion-list>
  </ion-content>
</ion-menu>

<!-- Disable swipe-to-go-back because it's poor UX to combine STGB with side menus -->
<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>

Answer 1

您可以使用离子CSS实用程序来对齐中心

<ion-title text-center>
    <img src="assets/imgs/logo.png" width="128" />
</ion-title>

阅读有关css实用程序的更多信息

https://ionicframework.com/docs/theming/css-utilities/

Answer 2

如果要将元素居中，请将text-align: center属性添加到其父元素。

在您的情况下，您需要将代码更改为：

  <ion-title style="text-align: center">
    <img src="assets/imgs/logo.png" width="128" />
  </ion-title>

Ionic 3侧菜单标题中心

2 个答案: