我如何让这张图片居中，让它在文字上方，让它很好地融合在一起？！（在离子中）

【问题标题】：How do I center this image, get it above the text, and have it play together nicely?! (in ionic)我如何让这张图片居中，让它在文字上方，让它很好地融合在一起？！（在离子中）
【发布时间】：2017-10-09 19:48:20
【问题描述】：

我试图让心脏图像居中于标题文本上方，而不是“落在”它后面/被切断。请帮忙！！！！！！

Image of how app looks now 标题

page-splash-page {
  .scroll-content {
  background: #FFFFFF;
}
ion-img {
  margin: 30px;
}

p {
  color: #0054A6;
  font-size: 20px;
  margin: auto;
  display: block;
  }
}

【问题讨论】：

这是我的 HTML 代码：
标题
编辑您的问题以包含您的 HTML 而不是将其放在评论中
将您的 html 添加到您的问题中并制作一个工作代码 sn-p

标签： html css ionic-framework ionic2

【解决方案1】：

来自 Ionic 文档，http://ionicframework.com/docs/api/components/img/Img/：

请注意，ion-img 在与标准 img 元素的比较。一个好的规则是，如果有一个页面上只需要渲染几张图片，那么标准的img是可能是最好的。但是，如果一个页面有数百个或甚至在可滚动区域内有数千张图片，然后 ion-img 会更适合这份工作。

因此，我建议为您的心脏图像使用简单的 img。为了居中，我建议使用以下内容：

在您的 html 中：

<div class="container">
  <img class="image" src="../assets/images/RACVD-logo-01.png" />
</div>
<p text-center> Title </p>

在你的 scss 中：

.container {
  display: flex;
  justify-content: center;
  width: 100%;
  .image {
    margin: 30px;
    width: 70px;
    height: 70px;
  }
}

【讨论】：