在Chrome扩展程序中停用文字字段蓝色高亮显示？ [英] Disable text-field blue highlight in Chrome Extension?

问题描述

我正在使用Chrome扩展程序，让您编辑一个小文本字段，我点击文本字段时发现蓝色突出显示非常讨厌。

I'm working on a Chrome extension that let's you edit a small text field, and I'm finding the blue highlight around the text field when clicked really annoying.

有没有办法（最好使用CSS）使这个亮点稍微更薄？我发现它有点太厚了，需要减肥。谢谢！

Is there a way (preferably using CSS) to make this highlight slightly thinner? I find it's a bit too thick, and needs slimming. Thanks!

蓝色突出显示的屏幕截图：

Screenshot of blue highlight:

推荐答案

是的;只需为'outline'属性赋值'none'：

Yes; just assign 'none' to the 'outline' property:

input {
    outline: none;
}

JS Fiddle demo 。

请注意，大纲是一个UI功能，用于突出显示当前活动/聚焦的表单元素， cue可能会阻碍某些用户。

Please consider that the outline is a UI feature to highlight the currently-active/-focused form element and removing that visual cue might hinder some users.

我打算禁用它/修改它，看看它能做什么。

I was intending to disable it/modify it to see what it could do.

要调整大纲的样式，您可以访问各个属性：

To adjust the style for the outline you can access the individual properties:

elementSelector:focus {
    outline-width: 4px; /* thin, medium, thick or standard CSS length units */
    outline-style: auto; /* or 'inherit', 'none' or border-style (solid, dashed, dotted...) */
    outline-color: #f90; /* standard CSS colors */
}

JS Fiddle demo 。

上述内容也可以使用缩写符号缩写：

The above can also be condensed, using shorthand notation:

elementSelector:focus {
    outline: 4px auto #f90;
}

可以使用的最小轮廓测量值为： p>

The smallest of the possible outline measurements that can be used are either:

elementSelector:focus {
    outline-width: thin; /* or 1px */
}

这篇关于在Chrome扩展程序中停用文字字段蓝色高亮显示？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！