如何删除文本/输入框周围的焦点边框（轮廓）？（Chrome）

小开

我找到了解决办法。
我在CSS中使用了：outline:none;，它似乎已经奏效了。无论如何感谢您的帮助。：）

小开

input:focus {outline:none;}

这就行了。橙色轮廓不会再显示了。

小开

最佳答案

此边框用于显示元素已聚焦（即您可以输入输入或使用回车键按下按钮）。不过，您可以使用大纲属性删除它：

textarea:focus, input:focus{outline: none;}

您可能希望添加一些其他方式让用户知道哪个元素具有键盘焦点，但为了可用性。

Chrome还将突出显示其他元素，例如用作模态的DIV。要防止这些元素和所有其他元素上的突出显示，您可以执行以下操作：

*:focus {outline: none;}

请注意，从输入中删除轮廓是一种可访问性差的做法。使用屏幕阅读器的用户将无法看到他们的指针聚焦在哪里。更多在a11yproject的信息

小开

这从所有和任何元素中删除Chrome中的橙色框架，无论它是什么和在哪里

*:focus {outline: none;}

小开

这肯定会起作用。橙色轮廓将不再显示…所有标签通用：

*:focus {outline: none;}

具体到某个标签，例如：输入标签

input:focus {outline:none;}

小开

请使用以下语法删除输入框的边框并删除浏览器样式的突出显示边框。

input {background-color:transparent;border: 0px solid;height:30px;width:260px;}input:focus {outline:none;}

小开

解决方案

*:focus {outline: 0;}

PS：使用outline:0而不是outline:none对焦。这是有效的，更好的练习。

小开

设置

input:focus{outline: 0 none;}

"！重要"只是以防万一。那没必要。[现在它不见了。-艾德。]

小开

当前的答案在Bootstrap 3.1.1中对我不起作用。这是我必须覆盖的内容：

.form-control:focus {border-color: inherit;-webkit-box-shadow: none;box-shadow: none;}

小开

<input style="border:none" >

为我工作得很好。希望在html本身中修复它…：）

小开

我发现你也可以使用：

input:focus{border: transparent;}