背景图像在使用 stellar.js 的移动设备上未正确显示答案

【问题标题】：background-image is not showing correctly on mobile devices using stellar.js背景图像在使用 stellar.js 的移动设备上未正确显示
【发布时间】：2015-07-28 13:09:56
【问题描述】：

大家好，我正在使用 stellar.js，它在桌面设备上运行良好。但在移动设备上，背景图像只会显示其中的一部分。它不是显示整个图像，而是显示图像的左角。问题一定是css代码。但我没有看到。谢谢大家的帮助！

我的 CSS 看起来像：

.intro-section {
    padding: 150px 0px;
    text-align: center;
    background-attachment: fixed;
    width:100%;
    height:100%;
    position: relative;
    background-position: center center;
    background-size: cover;
    background-image: url(../images/frederick_meseck_wood_logo.png);
    background-repeat: no-repeat;
}

@media(min-width:768px) {
    .intro-section {
        min-height: 100%;
    }
}

【问题讨论】：

标签： css mobile background-image stellar.js

【解决方案1】：

在您的媒体查询中试试这个：

@media(min-width:768px) {
    .intro-section {
        background-attachment: inherit !important;
        background-size: 100% 100%;
        background-repeat: no-repeat;
    }
}

第一个 background-size 参数是宽度，你可以在较小的设备上增加这个值（我推荐这个）

【讨论】：