html - 如何模仿焦点上的橙色轮廓？

Question

我正在创建一组 div，用户可以使用选项卡在其中导航，我想向元素添加标准的橙色焦点轮廓。

有人知道我需要做什么才能添加它吗？我知道它适用于 outline 属性，但我不确定将其设置为什么颜色，或者我是否最好使用带有一点模糊的框阴影来获得相同的效果。

此外，如果它是相关的，我正在使用 dojo 并避免使用 jquery - 但希望这是一个纯 css 解决方案:)

Answer 1

我会建议这个工作 jsFiddle ，请注意，为了完成此操作，您必须使用 <div tabindex="0"></div> .

每个浏览器都以不同方式呈现焦点。为了统一您网站上的整体体验，我建议使用 CSS 删除浏览器轮廓并添加您自己的样式。

据我所知，只有 Chrome 会呈现橙色轮廓，我已尽力匹配颜色，但您始终可以自己进行实验。