1

我有几个我使用类和 ID 设置样式的 Div,他 div 本身是空的,因为它们只是其背景的占位符。示例分区:

<div id='ranImg1' class='ranImg'></div>

然后我使用这个 css 为它们设置样式:

.ranImg {
  position:fixed;
  z-index:0;
  width:250px;
  height:250px;
  display:block;
}
#ranImg1 {
  left:10px;
  top:200px;
  background-attachment:fixed;
  background-image:url(http://localhost/MyAlbum//images/background/ranPaperclips.png);
  background-repeat:no-repeat;
}

只要 Div 位于文档的左上角,图像就会正确显示,但是当 Div 放置在页面上的其他位置时,图像会保持(不可见)在页面的左上角,仅显示与div(在示例中,这将是图像的底部)。

编辑 我试图在不影响我的其他布局的情况下定位这些 Div,它们位于其他布局的后面。除了背景图像不跟随 divs 位置这一事实之外,这有效。
所以基本上我的问题是,为什么 ranImg1 div 定位的背景不是 div 而是留在左上角,以及如何解决这个问题?

4

1 回答 1

3

background-attachment:fixed将附加相对于浏览器窗口的背景图像。如果您希望它“跟随”该div位置,只需删除该行:

#ranImg1{
  left:10px;
  top:200px;
  background-image:url(http://localhost/MyAlbum//images/background/ranPaperclips.png);
  background-repeat:no-repeat;
}

您还可以设置background-position属性以设置相对于包含 div 的背景:

background-position: 0px 0px;

我不确定这是否有助于除了去除之外background-attachment(还没有足够的咖啡!)

于 2008-12-01T20:59:49.573 回答