html 中链接的元素总是被图标元素挡住导致点不中怎么办呢

Can I use?

Less

Cool Libraries

› Jetstrap

This topic created in 1915 days ago, the information mentioned may be changed or developed.

<li style="top:60px;margin: 5;width: 55px;height: 55px;color: rgb(248, 248, 248);background-color: aquamarine;">

<a href="javascript:jump2baidu();" style="color: #fff;height: 55px;width: 55px;background-color: rgb(103, 34, 194);">

<embed src="vscode-icons/icons/light/files.svg" width="35px" height="35px" style="left: 5px;top: 5px;position: relative;z-index: -1;">

</embed>
</a>
</li>

比如这里的 embed 图标需要在最上显示,而 a 标签作为超链接被 embed 挡住点不了

修改了 z-index 属性以后 a 在 embed 上面导致点是能点了,图标不见了.......

这怎么解决啊

6 replies • 2021-08-10 13:39:28 +08:00

learnshare

Aug 10, 2021

https://codepen.io/ 上来个 demo

Puteulanus

Aug 10, 2021

图标设置 pointer-events 为 none 试试

misakawaque

Aug 10, 2021

@Puteulanus 感谢大佬,解决了

misakawaque

Aug 10, 2021

@Puteulanus 大佬,再问个问题
就是当一个超链接标签放在 li 标签里的时候,大小总是会变得很奇怪
该怎样解决呢
<ul class="layui-nav layui-nav-tree" lay-filter="test">

<li style="top:60px;margin: 5;width: 55px;height: 55px;color: rgb(248, 248, 248);background-color: aquamarine;">
<a href="javascript:jump2baidu();" style="color: #fff;height: 100%;width:100%;background-color: rgb(103, 34, 194);">
<embed src="vscode-icons/icons/light/files.svg" width="35px" height="35px" style="left: 5px;top: 5px;pointer-events: none;"></embed>
</a>
</li>
<ul>

misakawaque

Aug 10, 2021

![这是图片]( http://47.100.188.113/1a.jpg)

绿色是 li 标签而紫色是 a 标签
明明使用了 100%的描述,但是 a 小了一圈

Puteulanus

Aug 10, 2021

@misakawaque a 标签 display block 试试