有趣的情况与背景

Question

我有一个有趣的情况，我无法理解如何解决它。

我需要这样的东西，

这是一个例子，html中的背景重复，然后我们有包装，固定大小以水平为中心，但我必须看到背景，但在这种情况下没有光覆盖（或不透明）如果你愿意的话，图像必须匹配，任何人都可以帮助我吗？

我在这里做了http://jsfiddle.net/WfhHE/14/

Answer 1

更简单的解决方案是将背景位置设置为center 50px。因为你的内部div从顶部开始是50px并且宽度是背景图案的5倍，所以下面几乎应该是完美的：（working jsFiddle）

html {
height: 1000px;
/* Note the following change */
background: #fff url(http://lh3.ggpht.com/-6jQdie_mJCE/UeV2RpGb87I/AAAAAAAAAJo/PDZsV3baNwU/s0/bg.jpg) center 50px repeat;
position: relative;
}

Answer 2

对于重叠的图像，可以是：

• 使用普通半透明颜色作为背景（使用rgba and/or images）为其背后的图像着色或
• 使用background-attachment: fixed背景图片