HTML link 图片无效

Question

<div style="position:absolute; top:0; right:0">
    <a href="index.html">
        <img src="~/Content/Img/tr.png" alt="Türkçe" />
    </a>
    <a href="index_en.html">
        <img src="~/Content/Img/eng.png" alt="English" />
    </a>
</div>

我的主页上有 html 这块。图像显示但 link 不起作用。事实上，如果我删除它开始工作的样式。我很迷茫。

Answer 1

将 class on-top 添加到图像并使用下面的 CSS。

HTML:

<div style="position:absolute; top:0; right:0">
    <a href="index.html">
        <img class="on-top" src="~/Content/Img/tr.png" alt="Türkçe" />
    </a>
    <a href="index_en.html">
        <img class="on-top" src="~/Content/Img/eng.png" alt="English" />
    </a>
</div>

CSS:

.on-top {
    position: relative;
    z-index: 1;
}

Answer 2

您需要将 z-index 添加到链接周围的 div。

现在 <div class="fp-tableCell" style="height:776px;"> 正处于您遇到问题的 div 之上。

将此添加到您遇到问题的 div：

<div style="position:absolute; top:0; right:0; z-index:999;">

Answer 3

发生的事情是你有另一个 DIV 恰好与这个

重叠

我会将第一行更改为类似这样的内容，它应该可以工作

<div style="position:absolute; top:0; right:0; z-index=1000" >

Answer 4

某些元素与您的链接重叠，只需在您的 <div> 样式中添加 z-index: 1;，jaunt 得到答案！

<div style="z-index: 1; position:absolute; top:0; right:0">
    <a href="index.html">
        <img src="images/tr.png" alt="Türkçe">
    </a>
    <a href="index_en.html">
        <img src="images/eng.png" alt="English">
    </a>
</div>

Answer 5

好的，您可以在父级 div 中设置 z-index:1 或者您可以应用

position:absolute;
top:0;
right:0;

和

position:absolute;
top:0;
right:40px;

到 a 标签内的 img 标签，而不是父 div 标签。我敢肯定还有其他方法，但这些似乎是最简单的。

HTML link 图片无效

HTML link of image doesn' work

html

css

image

hyperlink