离子标题图像和文本不出现在同一行

Question

我必须使离子标题图像和文本出现在同一行，但文本放置得比图像低一点。

<ion-header-bar class="bar-positive" align-title="center">
    <h1 class="title" >
        <img class="title-image" src="http://www.fnordware.com/superpng/pngtest16rgba.png" height="80%" />
        <span>App Project</span>
     </h1>
  </ion-header-bar>

Codepen ex

Answer 1

只需将vertical-align: middle;设置为title-image，就像这样：

.title-image {
  vertical-align: middle;
}

这将使其与标题/文字垂直对齐。

Codepen