将按钮放在中心哦工具栏离子2

Question

我需要在工具栏的中央放一个按钮，我左边有一个按钮。这是我的代码：

<ion-toolbar>
 <button ion-button icon-only menuToggle>
  <ion-icon name="menu"></ion-icon>
 </button>

 <ion-buttons end>
  <button ion-button icon-only class="button-navbar">
    <ion-icon name="ios-refresh"></ion-icon>
  </button>
  <button ion-button icon-only class="button-navbar button-right">
      <ion-icon name="ios-cart-outline"></ion-icon>
  </button>

 </ion-buttons>
</ion-toolbar>

有了这个我有我的togglemenu和右边的两个图标，我想在工具栏的中间有一个：

提前谢谢！

Answer 1

我使用ion-title属性管理它：

<ion-header>
  <ion-toolbar>
    <button ion-button icon-only menuToggle class="pink">
      <ion-icon name="menu"></ion-icon>
    </button>

    <ion-title>
      <button ion-button icon-only class="button-navbar pink" id="nobackground">
        <ion-icon name="ios-refresh"></ion-icon>
      </button>
    </ion-title>

    <ion-buttons end>
      <button ion-button icon-only class="button-navbar pink">
          <ion-icon name="ios-cart"></ion-icon>
      </button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

并以CSS为中心：

ion-title {
    text-align: center;
}

.pink {
    color: #F63566; 
    margin: auto;
}

不要忘记在图标上添加margin auto：）