Javascript HTML5 CSS（如何悬停图像忽略透明）

我有两个图像；一个在另一个之上：

HTML:

---

我需要标记三角形，但需要标记锚定，因为鼠标位于锚定透明位置（如何忽略它？）

首先，将样式移出内联-然后可以将三角形的

z-index

设置为大于锚定，使其“出现”在顶部，使用专门链接到三角形的

：悬停

选择器时（如果希望三角形与两者都相关，请删除

#三角形

）：

---

包含JSFIDLE链接而不包含代码是违反规则的。请不要试图通过编码JSFIDLE链接来绕过它们。问题应该包括重现问题所需的代码。为锚点添加悬停选择器，然后将“#三角形：悬停”更改为“#锚点：悬停，#三角形：悬停”或者，要同时执行这两个操作，请将“#三角形：悬停”更改为“#三角形：悬停，#三角形：悬停+#锚点”

<img src='http://etc-mysitemyway.s3.amazonaws.com/icons/legacy-previews/icons-256/3d-transparent-glass-icons-media/001429-3d-transparent-glass-icon-media-a-media21-arrow-back.png' style='position: absolute; top: -50px; left: -70px'>
<img src='http://etc-mysitemyway.s3.amazonaws.com/icons/legacy-previews/icons-256/3d-transparent-glass-icons-transport-travel/036411-3d-transparent-glass-icon-transport-travel-anchor6-sc48.png' style='position: absolute; top: 20px; left: 20px'>

img:hover {
    background: blue;  
}

#triangle {
    position: absolute;
    top: -50px;
    left: -70px;
    z-index:1;
}
#triangle:hover{
    background:blue;
}
#anchor {
    position: absolute;
    top: 20px;
    left: 20px;
    z-index:0;
}