Android浏览器 - 锚点聚焦时删除轮廓边框

Posted 2023-02-22

【中文标题】Android浏览器 - 锚点聚焦时删除轮廓边框

【英文标题】：Android browser - remove outline border when anchor is focused

【发布时间】：2011-11-15 23:01:39

【问题描述】：

我在我的 android 应用程序上使用加载外部页面的 web 视图。 它有几个锚点（<a> 标签）。当我按下它时，会出现黄色边框。

我怎样才能防止它并删除这个边框？

我尝试了以下技巧：

// jQuery
$("a").focus(function()
    $(this).attr("hideFocus", "hideFocus");
);

// CSS
a, :focus 
    outline: none;

但没有成功。

谢谢！

【问题讨论】：

不应该a, :focus 是a:focus？

:focus 不匹配所有可以聚焦的元素，甚至按钮等？

【参考方案1】：

设置CSS属性-webkit-tap-highlight-color如下：

*  -webkit-tap-highlight-color: rgba(0,0,0,0); 

注意：由于 webkit 呈现高亮的方式，以其他方式设置颜色通常会失败。根据我的经验，取决于版本/变体。

【讨论】：

-webkit-focus-ring-color: rgba(0,0,0,0); ?

【参考方案2】：

根据this发帖最好用

a:focus,
button:focus,
input:focus,
textarea:focus 
    outline: none;