使用透明度堆叠png与css内部的div

Question

我有几个div，每个包含2个应该堆叠的透明图像。

我试着将第一个设置为背景。出于某种原因，img不透明。

然后我尝试堆叠div中的图像。但我仍然有透明度问题。

检查小提琴：http://jsfiddle.net/Epby4/

<div class="row"> 
    <div class="span9"> 
      <div class="ring" id="ring57"> 
      <a class="images" href="/rings/57/edit"> 
       <img src="https://lxproject.s3.amazonaws.com/uploads/band/img/29/thumb_ringblack.png" width="160"> 
       <img class="cut" src="https://lxproject.s3.amazonaws.com/uploads/cut/img/11/thumb_roundcut.png" width="160" style="background-color : transparent;"> 
       </a> 
      </div> 
      <div class="ring" id="ring66"> 
      <a class="images" href="/rings/66/edit"> 
       <img src="https://lxproject.s3.amazonaws.com/uploads/band/img/27/thumb_band_yellow.png" width="160"> 
       <img class="cut" src="https://lxproject.s3.amazonaws.com/uploads/cut/img/14/thumb_ring4_center.png" width="160" style="background-color : transparent;"> 
       </a> 
      </div> 
      <div class="ring" id="ring67"> 
      <a class="images" href="/rings/67/edit"> 
       <img src="https://lxproject.s3.amazonaws.com/uploads/band/img/27/thumb_band_yellow.png" width="160"> 
       <img class="cut" src="https://lxproject.s3.amazonaws.com/uploads/cut/img/15/thumb_ring5_center.png" width="160" style="background-color : transparent;"> 
       </a> 
      </div> 
    </div> 
</div> 

和CSS：

div.ring { 
    float: left; 
    position: relative; 
    border: 1px solid red; 
    width:160px; 
    height:130px 
} 
div.ring img { 
    position:absolute; 
    background: transparent; 
} 

Answer 1

你png的是不是透明的。他们有一个白色的背景。

他们也损坏，不能在Photoshop中打开。

我怀疑你真正救了他们为jpeg的，但有png文件扩展名