HTML5 summary outline轮廓处理a标签策略实例页面

回到相关文章 »

效果：

这是示例 点击无外框，键盘focus有。

代码：

CSS代码：
summary {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    outline: 0;
}
summary a {
    color: inherit;
    pointer-events: none;
}
HTML代码：
<details open>
    <summary tabindex="-1"><a href="javascript:">这是示例</a></summary>
    <content>点击无外框，键盘focus有。</content>
</details>