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时需要注意一些事情。

切割时确保你背景已关闭。
导出为png24。
如果您在ie6中需要使用双螺旋png修复
http://www.twinhelix.com/

尝试以下步骤。您不必更改图像的不透明度，因为它会影响整个图像。当你使用z-indexing时，你也应该放置位置css元素

透明PNG作为背景图象

2 个答案: