css - 卡内图像中的 ionic 3 浏览器特定问题

Question

我的代码目前看起来像这样:

HTML:

<ion-slides direction="vertical" speed="1000" slidesPerView="1">
    <ion-slide  class="home-intro"style="background-color:#2298D3">
</ion-slide>

CSS:

.home-intro {
    background: url('http://www.segalpetroniru.com/images/Consulting-Services-Hero-Image-Secondary.jpg') no-repeat top center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: 100%;
}

这在 Chrome 中工作正常，但在 Safari 中图像的顶部被剥离。检查示例 here .

Answer 1

从 CSS 的 background 规则中移除 fixed:

.home-intro {
    background: url('example.jpg') no-repeat top center;
    ...
}