单页网站的多个背景

Question

我遇到的许多单页网站的div部分都有多个图片。 它们在顶部有一个图像，适合浏览器的整个高度和宽度，然后在滚动时，下一个图像也是如此。 我试图通过以下代码实现这一目标：

CSS：

.main   {
    background-image:   url("pg2background.jpg");
   background-repeat:no-repeat;
   background-position:right top;
 /* Set rules to fill background */
    min-height: 100%;
    min-width: 1024px;

  /* Set up proportionate scaling */
    width: 100%;
    height: auto;

 }

HTML：

<div class="main">
</div>

不知道出了什么问题。它不起作用。