Ionic-Header 栏上方的内容答案

【问题标题】：Content going above Ionic-Header barIonic-Header 栏上方的内容
【发布时间】：2015-04-21 15:48:54
【问题描述】：

我正在使用 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/

【问题讨论】：

标签： html css ionic-framework ionic

【解决方案1】：

您可以像 <ion-content class="has-header"> 那样定义您的离子含量 has-header 类是标准的离子类

然后你的图片将进入 DOM 并且不会覆盖 headerR。

【讨论】：

【解决方案2】：

将 max-width 和 max-height 修复为 image-viewer 类中的某个值

【讨论】：