代码之家  ›  专栏  ›  技术社区  ›  MineGlade

CSS视差滚动:不显示背景图像

  •  1
  • MineGlade  · 技术社区  · 7 年前

    所以我试图用css3实现视差滚动。 我坚持使用w3schools教程,但我的图像没有显示在我的网页上。 这是我的HTML:

        <!--Main Content-->
    <main>
        <div class="parallaxBG">
    
        </div>
    </main>
    

    这是我的CSS:

    .parallaxBG {
        background-image: url("Resources/Images/2018-01-03_17.07.41.png");
        height: 100%;
        background-attachment: fixed;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }
    

    有人能回答吗?

    1 回复  |  直到 7 年前
        1
  •  4
  •   Steve K    7 年前

    将所有父元素的高度设置为100%,否则视差div将没有100%的高度填充,只有0的高度,并且在该div中放置一些内容之前,不会显示任何内容。

    比如:

    body, html, main{height:100%;}