Bootstrap CSS背景位置在移动设备上不起作用

Question

感谢您在我的第一个问题上耐心等待。我正在学习 Bootstrap（我是一名正在学习代码的设计师），经过大量的试验和错误，但我很喜欢它。所以这是交易：

我正在重新设计我的公司网站，并将媒体查询添加到我的移动设备 CSS 中。当我添加和调整背景位置时，我可以立即在 Dreamweaver 和我的实时预览中看到调整。但在我的移动设备（iPad 和 iPhone 5）中，X 轴移动，而不是 Y 轴。

这是我的测试站点：http://test.lighthousesoftware.com

Here are my mobile screens

我应该怎么做才能在手机屏幕上看到波浪背景（我想将图像向上移动 Y 轴）？

这是我的 HTML：

<header>
    <div class="header-content">
        <div class="header-content-inner">
            <h1 id="homeHeading">Automated Business Process,<br>Your Business Intelligence </h1>
            <hr>
            <p>Prism vice artisan, venmo migas you probably haven't heard of them crucifix meditation organic marfa cardigan. Dreamcatcher banh mi synth, organic flannel hell of gastropub keffiyeh marfa poke roof party. </p>
            <a href="#about" class="btn btn-primary btn-xl page-scroll">Find Out More</a>
        </div>
    </div>
</header>

还有我的 CSS：

    header {
        position: relative;
        width: 100%;
        min-height: auto;
        background-size: cover;
        background-image: 
        url("https://lssinc.com/files/original/header.jpg");
        text-align: center;
        background-attachment: fixed;
        background-position: 25% 0;
        color: white;
        height: 80%;
    }
    @media only screen and (max-width: 1024px) {
        header {
            background-image: url(url("https://lssinc.com/files/original/header.jpg");
            background-size: cover;
            background-repeat: no-repeat;
            background-position: 0px 20px;
            background-attachment: fixed;
            color: white;
            height: 80%;
            text-align: center;
        }
    }
    @media only screen and (max-width: 320px) {
        header {
            background-image: url("https://lssinc.com/files/original/header.jpg");
            background-size: cover;
            background-repeat: no-repeat;
            background-position: -70px -80px;
            background-attachment: fixed;
            color: white;
            height: 150%;
            text-align: center;
        }
     }

Answer 1

好问题！我相信这个问题已经回答了here。问题在于背景尺寸：封面。