html - 如何使重叠链接可点击

标签 html css

<分区>

根据设计,我的 div 中的行高略小于字体大小,因此链接重叠。其中前两个是部分可点击的。

<div style="width:25px;line-height:8px;">
    <a href="/link1" style="font-size:10px;z-index:10;">link1</a>
    <a href="/link2" style="font-size:10px;z-index:9;">link2</a>
    <a href="/link3" style="font-size:10px;z-index:8;">link3</a>
</div>

我已经尝试将更高的 z-index 设置为更高的链接,如我在示例中所示,但这没有帮助。

JSFiddle:http://jsfiddle.net/pQ4RV/

最佳答案

为了使 z-index 起作用,您需要指定

position: relative;

在您为其指定索引的元素上。

但一般来说,您应该解决行高问题,而不是使用 z-indexing 编写解决方法。

关于html - 如何使重叠链接可点击,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23895285/

上一篇:Jquery hover() 在图像上

下一篇:html - 仅在文本中带有背景的跨度

相关文章:

javascript - Css - 是否可以在调整屏幕大小时移动元素以使其适合屏幕

javascript - 我的 <div class = content "> 与 nav-justified 重叠

javascript - JQuery 不更新 :last Filter for Dynamically Added Elements

html - 将 2x2 图像裁剪并叠加到 4x4 网格上,不重复列/行

javascript - HTML 音频 - 使用 jQuery 检测位置

html - 跨 div 对齐对象

javascript - 为什么我不能只在 <head> 中声明脚本?

html - 在不使用负边距的情况下将图标与文本对齐

html - 父 div 没有根据其子项的高度来计算高度。

css - 透明背景上的透明字体