内容超过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 class="has-header">的离子内容 has-header类是标准离子类

您的图像应该进入DOM，然后不会覆盖headeR。

Answer 2

将max-width和max-height修复为图像查看器类中的特定值