如何在滚动时使图像静止

Question

所以我在页面顶部有一个边框，当我向下滚动时，我希望它保持在同一位置。我曾尝试将position: fixed放在许多不同的位置，但仍然无法使它起作用。另外，如果可能的话，我希望其他内容可以滚动到该图像后面。这是我的代码：

    <div style='
      background-image: url(http://i111.photobucket.com/albums/n144/baby_painting/bowlace2.gif);
      background-repeat: repeat-x;'>
         <img src="http://i111.photobucket.com/albums/n144/baby_painting/bowlace2.gif">
    </div>

用于nikkidarlinggg.tumblr.com页面对不起，如果我没有正确输入此信息，则我以前从未使用过此网站。

Answer 1

将这些样式添加到div：

position: fixed;
width: 100%;
z-index: 10;

Answer 2

这将解决您的问题：

   <div  class='fixed' ></div>
   <div class='content'>Your content here </div>

和固定班级：

.fixed{
 position:fixed;
 top:0;
 z-index: 1;
 width:100%;
 height:100%;
 background-image:url(http://i111.photobucket.com/albums/n144/baby_painting/bowlace2.gif);background-     
 repeat: repeat-x; 
}
.content{margin-top:57px;}

在HTML内的CSS内使用CSS：

   <div style="position:fixed; top:0; z-index: 1; width:100%;height:100%;background-image:url(http://i111.photobucket.com/albums/n144/baby_painting/bowlace2.gif);background-repeat: repeat-x;" >
  </div>
  <div style='margin-top:57px;'>Your content here </div>

此处演示：http://jsfiddle.net/Nsuj7/

Answer 3

您是否尝试过：position:absolute？

Answer 4

<div style="background-image: url(http://i111.photobucket.com/albums/n144/baby_painting/bowlace2.gif);background-repeat: repeat-x;position:fixed;width:100%;z-index:2;height:57px"></div>

[尝试使用z-index 2或更高的值。