两个单独的背景图像

我想让我的页面有两个背景图像：一个在顶部，一个在底部。不过，我不希望它们是静态的。我将如何做到这一点？两个单独的背景图像

2010-02-01 Ethan Turkeltaub

多一点信息将是有益的，因为prodigitalson指出。一个模型也会很有帮助。这里有很多变量，并且有很多不同的方法可以用CSS来实现。 –

这真的取决于你需要什么样的页面看起来像什么样的背景图像。如果你想要一个解决方案你需要发布更多的细节，最好有一个页面应该看起来像一个合成图像和一个自己的图像的例子。

提到的一种方式可能是：

html {backgoround: trasnparent url(/path/to/image) scroll no-repeat top center;} 
body {backgoround: trasnparent url(/path/to/other-image) scroll no-repeat bottom center;}

来源

2010-02-01 19:49:44 prodigitalson

我想要做的是有第一个图像在页面的顶部（如“背景：URL（/路径/到/图像）repeat-x;”）。第二张图片沿着页面的底部。所以，当你向下滚动到页面的结尾时，它就在底部。 –

对，但你不会有一个设置页面高度是你？当页面很短，很长，正常等时，你如何需要这些图像的行为？你需要一个纯色之间？这种颜色是与底部图形的顶部还是顶部图形的底部相关的？ – prodigitalson

将div与背景图像结合使用，并使用布局或定位属性进行适当的放置。你可以把它放在顶部，放在一个绝对位置和z-indexed的div中，放在你的常规页面下面。然后另一个可以放在身体的风格和定位在底部。

来源

2010-02-01 19:48:24

请零裕度和填充，像这样两个嵌套的层：

<div class="outer"> 
    <div class="inner"> 
    <!-- Page goes here. --> 
    </div> 
</div>

然后具有外部和内部，一个固定到顶部，一个固定于底部的一个单独的背景图像：

.outer { 
    background-position: bottom; 
    // ... 
} 

.inner { 
    background-position: top; 
    // ... 
}

来源

2010-02-01 19:48:56

两个单独的背景图像

回答

相关问题