html - 背景定位和附着

标签 html css background

我现在正在做一个网站,我有两个背景图片。我希望第一个背景图像不滚动。我希望它留在原地,当图像结束时,应该开始一个新的背景图像。

我希望第二个背景图像随内容滚动,我认为这是背景附件的固定属性。问题是第二个背景图像不随内容滚动。

它只是在内容结束前的某个时刻停止,并在页面底部留下空白。我已经尝试了几乎所有与背景定位、背景附件和溢出的不同组合有关的事情,但我无法让它工作。

这是背景图片的代码:

body {
    font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
    background-image: url(bg2.jpg), url(bg3.jpg);
    background-repeat: no-repeat, repeat-x;
    background-position: left top , 1920px 1288px; 
    background-attachment:local, scroll;
    overflow: auto, visible;
    margin: 0;
    padding: 0;
    color: #000;
}

对于 background-attachment 属性,我试过固定第二张图片,但它不起作用。

有关我的问题的引用,您可以查看我正在处理的页面 here . 如您所见,第二张背景图片没有继续页面底部的内容。

如有任何帮助,我们将不胜感激。

谢谢。

最佳答案

根据我的评论,您将在 http://www.css3.info/preview/multiple-backgrounds/ 上找到可能的解决方案

CSS3 多背景图片不适用于 IE 9 以下。

如果你想要 fiddle ,请告诉我。

关于html - 背景定位和附着,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18845469/

相关文章:

html - 同级显示多张图片有什么方法?

html - 来自中心/中间的线性渐变背景

android - 通过单击按钮更改 Android SDK 中的背景颜色不起作用

java - 将带有前景标签的图像添加到 Jbutton

html - 使用自动滚动设置 div 的背景颜色

jquery - 使用 jQuery 获取 html 元素的特定祖先

javascript - HTML CSS 用 ul 包装 li

php - Opencart Admin 如何将选项卡添加到模块中

HTML表格单元格如何设置宽度

javascript - 如何在 tr 标签和除以 | 之间留出空间在 html 中