透明PNG作为背景图片

Question

我有一个带有透明png元素的元素作为背景图片-就像拍立得照片被切掉，所以只显示了框架。

然后，以此为背景，我希望将标准图像放置在具有透明png背景的元素后面，以适合框架。

我尝试设置z-indexing和不透明度，尽管由于不透明度设置，我可以使图像通过其明显的透明度显示。

有任何想法吗？

Answer 1

如果.yourPhoto是背景图片，则可以执行以下操作：

<div class="yourPhoto">
    <div class="yourPNGframeImage">
    </div>
<div>

或者，您可以使用嵌入式图像并将两个图像都定位为绝对值：

 <div class="container">
      <img class="yourPhoto" src="">
      <img class="yourPNGframeImage src="">
 </div>

.container {position: relative;}
.yourPhoto, .yourPNGframeImage {position: absolute; top: 0px; left: 0px;}

Answer 2

执行PNG时要注意很多事情。

1. 切割时，请确保您的背景关闭。
2. 导出为png24。
3. 如果您在ie6中，则需要使用诸如twin-hellix png fix之类的东西
4. http://www.twinhelix.com/

尝试这些步骤。 您不必更改图像的不透明度，因为它会影响整个图像。 使用z-indexing时，您还应该将位置css元素放入