透明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元素放入