html - Ionic-Header 栏上方的内容

Question

我正在使用 Ionic-Header 栏来满足我的需要。我调整了栏的样式如下:

.bar.bar-positive {
  background: #00D7FF;
  border: none !important;
}

现在我的内容中有一张图片，有时会变得非常大和高，导致它与我的 Ionic-Header 栏重叠。图片的样式如下:

<img ng-src="{{imageDataViewer.currentCID}}" ng-show="currentCID" class="image-viewer">

.image-viewer {
  width: 100vw;
  max-width: initial;
  max-height: auto;
}

有什么方法可以解决这个问题？我正在尝试用图像填充内容。

http://ionicframework.com/docs/api/directive/ionHeaderBar/

Answer 1

您可以像那样定义 ion-content <ion-content class="has-header">has-header类是一个标准的ionic类

然后您的图像将进入 DOM，并且不会覆盖 header。