CSS - 如何在滚动图像上制作固定背景图像？

Question

我有一个导航栏在图像顶部。理想情况下，此导航栏图像将位于背景图像的顶部，并在向下滚动时消失。没有办法让这成为可能（2张背景图片1滚动其他固定）

Answer 1

HTML

<div id="scroll" class="nav">Scrolling</div> 
<div id="fixed" class="nav">Fixed</div> 

CSS：

.nav { 
    top: 0; 
     left: 0; 
     height: 100px; // position and size only example, adjust to your needs 
     width: 100%; 
} 
#scroll { 
     position: absolute; 
     background: url(yourimage.png); 
     z-index:1; 
} 
#fixed { 
    position: fixed; 
    background: url(your2ndimage.png); 
    z-index:0; 
    } 

这将使#FIXED背景只显示该窗口后，被滚动下来...