Question

十分钟后，由于某种原因，我已经在我脑海中，并且非常感谢任何帮助。我有一个我正在尝试编码的布局，见here。基本上我希望在向下滚动页面时保持背景图像（咖啡豆）的固定。但是，主要内容不希望保持居中，并且bg图像不希望保持固定。无论我做什么，主体都会向左上方而不是中心对齐，或者bg图像被拧紧。任何可以指向我正确方向的人都是英雄！到目前为止的页面可以看到here。

    html, body {
background-color: #e0dac8;
}
#content {
background-image: url(IMG/bg_head.jpg);
background-color: #e0dac8;
background-repeat: no-repeat;
background-position: center top;
margin: 0px;
padding: 0px;
position: absolute;
}
#wrapper {
margin: auto;
height: auto;
width: auto;

}

Answer 1

不要使用绝对定位。

只需添加边距：

#content {
  margin-left: auto;
  margin-right: auto;
}

Answer 2

#content {  margin:0 auto;}

会做到这一点。

Something I tried

Answer 3

这是你想要的吗？ http://jsfiddle.net/LRxpA/embedded/result/

我用“margin：0 auto;”删除了postion绝对和居中的#content，然后用“background-attachment：fixed;”修复了背景。

以下是代码：http://jsfiddle.net/LRxpA/

绝对位置的噩梦 - 不能将事件中心的主要内容与全身bg联系起来

3 个答案: