在 Chrome 中删除焦点颜色

Posted 2023-03-06

【中文标题】在 Chrome 中删除焦点颜色

【英文标题】：Removing a focus color in Chrome

【发布时间】：2012-03-31 09:17:29

【问题描述】：

当我的输入和 textarea 字段获得焦点时，它们会出现一种颜色：

这似乎发生在 Chrome 中，但不是 Firefox。

我尝试过用一点 jQuery 来改变颜色：

if ($('body').is('#contact')) 
        $('input').focus(function() 
            $(this).css('border', '2px solid #ce1443');
            console.log('focus');
        );

         $('textarea').focus(function() 
            $('textarea').css('border', '2px solid #ce1443');
        );
    

但是，这似乎只会使当前边框变大......但它无法摆脱蓝色。

【问题讨论】：

可能与***.com/questions/2943548/…重复

【参考方案1】：

这是你可以通过 CSS 解决的问题：

input:focus 
  outline: 0 none;

【参考方案2】：

使用outline: none CSS 属性：http://jsfiddle.net/ZnefN/。

【讨论】：

嗯...这似乎在 Chrome 中工作...但是我在 Firefox 中看到了大纲？

等等...这只是 jsfiddle 添加我认为的大纲

【参考方案3】：

在 css 中尝试：

input:focus 
    outline: none;

并获取所有输入和文本区域并选择框

input:focus, select:focus, textarea:focus 
    outline: none;

另外，我认为这对this question 来说可能是多余的

【讨论】：

我认为设置 outline-width: 0 也有帮助。

很可能对 chrome 有帮助，尽管我认为 IE 将outline-width 视为一种不同的属性，并且也可能隐藏边框或文本阴影。我可能是错的，除非老板让我，否则我不会用 IE 测试，但只是一个想法。