Javascript fullpage.js背景图像未覆盖

我将fullpage.js与背景图像一起使用，但问题是它们不会在页面加载时自动调整大小。它们只在缩放浏览器时调整大小以覆盖背景，加载时它们看起来非常大，被裁剪并固定在上顶部。有人有这个问题吗？我用的是铬

<div id="fullpage">
        <div class="section " id="section0">

            <div id="mainTourNav" class="container">
                <ul>
                    <li id="tourNav1"><a href="#"></a> </li>
                    <li id="tourNav2" class="tourNav"><a  href="#"> Slide 1</a></li>
                    <li id="tourNav3" class="tourNav"><a  href="#"> Slide 2 </a></li>
                    <li id="tourNav4" class="tourNav"><a  href="#"> Slide 3 </a></li>
                </ul>
            </div>
        </div>
        <div class="section" id="section1">
            <h1>It’s about Friends and Family. . .</h1>

        <div class="section" id="section2">
            <h1>It's about design. . .</h1>


        </div>
        <div class="section" id="section3">
            <h1>It’s about the game you love. . .</h1>

        </div>
    </div>

---

解决了。基本上我改变了：

#section0,
    #section1,
    #section2,
    #section3{
        background:cover;
    }

到

---

将以下属性添加到第3节

#section3{
    width:100%;
    height:100%;
    background-size:100% auto;
    background-repeat: no-repeat;
}

---

不幸的是，这使得所有其他部分的背景照片都没有显示出来。你的问题是CSS，而不是fullPage.js。您应该清楚地说明您希望图像如何“调整大小”或“适合”屏幕。现在你没有告诉我们任何关于它的事情。@Alvaro-the-Fullpage.js使用这个css来实现同样的效果。

部分{background:cover；}

我本以为可以这样做，但我找到了答案，并在下面给出了答案。

部分{background:cover；}

不是fullPage.js中的任何代码，它只是用于示例的代码。正如我所说的，这都是关于CSS的，而不是关于fullPage.jsYa。我想我应该说这个问题是fullPage.js给出的示例中的CSS问题。

#section0,
    #section1,
    #section2,
    #section3{
        background:cover;
    }

#section0,
    #section1,
    #section2,
    #section3{
        width:100%;
            height:100%;
            background-size:100% auto;
            background-repeat: no-repeat;
    }

#section3{
    width:100%;
    height:100%;
    background-size:100% auto;
    background-repeat: no-repeat;
}