Html 仅通过选项卡导航显示橙色边框

问题：我为一些div添加了一个“tabindex”属性，这样就可以通过tab键键盘导航访问它们。但现在，只要点击div，它就会给出一个橙色的订单，这给用户带来了糟糕的体验。我只想在用户使用键盘导航到div时显示橙色边框，而不是在用户单击div时显示橙色边框

下面是说明该问题的JSFIDLE链接。该按钮将仅通过选项卡导航获得橙色边框，其中当单击div时，它将立即获得橙色边框。 如何模拟按钮与div的类似行为

注意：我知道将

outline:none

css添加到：focus状态会删除大纲，但是当用户使用键盘导航到div时，也会删除大纲

有人能帮我吗。

---

提前感谢。：）

您可能想考虑使用jQuery，如您所描述的删除大纲，然后在按下TAB时添加一个KEYUP事件，如果您的字段被聚焦，则将Debug大纲改为默认。@索尼：谢谢，我实际上对知道按钮/输入按钮的内部实现感兴趣，并且如果存在一个更简单的解决方案。i、 e.通过CSS。