具有不同图像大小或高度的离子滑块

Question

我正在使用ion-slide-box，但问题是，我的ion-slides图像大小不一样，它使用 ng-repeat 动态重复不同大小的图像

                    <ion-slide ng-repeat="sliderimages in sliderimages">
                        <img src={{sliderimages.url}} style="width:100%;height:auto;"/>
                    </ion-slide>
                </ion-slide-box>

我使用这个 CSS 来适应所有图像的高度

.slider {
  height: 200px;
  width:100%;
}
.slider-slide {
  color: #000;
  background-color: #fff;
  height: 100%;
  width:100%;
}

但身高不太合适

我必须添加任意大小的图像，使其适合 Ionic 滑块。

Answer 1

不要对图像标签应用明确的宽度或高度。相反，给它：

max-width:100%;
max-height:100%;

示例： http: //jsfiddle.net/xwrvxser/1/

问候。