我正在尝试将一些链接放在 <summary>
中元素,如果 <a>
标签只包含一个图标 <i>
,它不起作用(点击它只会打开 <details>
元素……)。
我的代码:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
</head>
<body>
<details>
<summary>
<span>Foo</span>
<span><a href="http://www.google.com">text link</a></span>
<span><a href="http://www.google.com"><i class="material-icons">send</i></a></span>
</summary>
<span>Bar</span>
</details>
</body>
</html>
有人会知道我错过了什么吗?
我尝试了 Material 图标以外的其他图标,但没有结果……
编辑:这是一个 Chrome 错误(它与 Firefox 一起工作):有人知道解决方法吗?
最佳答案
这是我的解决方法:
summary a * {
pointer-events: none;
}
这使得点击直接发送到链接而不是内部元素
关于html - 链接不适用于 <summary> 元素中的图标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48538675/