在Chrome扩展程序中停用文字字段蓝色突出显示?

时间:2012-02-26 16:57:49

标签: html css google-chrome-extension textfield highlight

我正在使用Chrome扩展程序,您可以编辑一个小文本字段,而且当点击时,我发现文本字段周围的蓝色突出显示非常烦人。

有没有办法(最好使用CSS)使这个亮点略微变薄?我发现它有点太厚了,需要减肥。谢谢!

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

enter image description here

1 个答案:

答案 0 :(得分:11)

是;只需将'none'分配给'outline'属性:

input {
    outline: none;
}

JS Fiddle demo

请考虑大纲是一个UI功能,以突出显示当前活动/聚焦的表单元素,并删除该视觉提示可能会阻碍某些用户。


编辑以回应Beakr,OP的评论左下角,在下面的评论中:

  

我打算禁用它/修改它以查看它可以做什么。

要调整outline的样式,您可以访问各个属性:

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

以上也可以使用速记符号来缩小:

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

可以使用的最小可能轮廓测量值是:

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