0

我一直试图弄清楚一些事情，但没有运气。我也一直在互联网上寻找可能的解决方案，但同样没有运气。

假设我想要一个带有文本的图像在用户查看网站时向下滚动时保持固定在背景中，我该怎么做呢？（也反应灵敏）。

我已经尝试过很多事情，但是当我希望它留在背景图像中时，当调整窗口大小时，文本会超出背景中的图像。

 html5
    ===========


           <body>
            <header id="head">
            <!--head content-->
            </header>
            <div class="fixedImage">
               <div class="welcome">
                   <h1>Welcome to this site</h1>
                   <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec commodo, enim eu posuere commodo, elit mauris condimentum sem.</p>
               </div>
            </div>
            </body>


        css
        ======
    #head{
       width:100%;
      background-color:#FFFFFF;
    }

    .fixedImage{
     background-attachment:url(img/random.jpg);
     background-size: 100%;
     background-repeat:no-repeat;
     background-attachment:fixed;

}

             .welcome{
                /*styling goes here*/
    }

我想做的一个huuuuuuuge示例是这样的：

http://www.nois3.it/

固定在顶部的图像，其中包含文本，并且在调整大小时不会溢出图像。

如果有人能帮我解决这个该死的事情，那就太棒了！

感谢您的时间！

4

1 回答 1

0

使用带有 CSS 的 div，位置：绝对；

问题也在这里得到了解答：

css - 浮动 div 定位

于 2014-04-04T03:40:29.290 回答