如何删除文本/input框周围的边框（大纲）？ （Chrome）

任何人都可以解释如何删除文本/input框周围的橙色或蓝色边框（轮廓）？ 我认为只有在Chrome上才会显示input框处于活动状态。 这里是我使用的inputCSS：

input { background-color: transparent; border: 0px solid; height: 20px; width: 160px; color: #CCC; } 

Answer 1

这个边框用来显示元素是否被聚焦（也就是说你可以inputinput内容或者用Enter按下button）。 但是，您可以删除它：

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

您可能想要添加一些其他方式让用户知道什么元素有键盘焦点，但为了可用性。

Chrome也会将突出显示应用于其他元素，例如用作模块的DIV。 为了防止这些和所有其他元素的亮点，你可以做：

 *:focus { outline: none; } 

Answer 2

 input:focus { outline:none; } 

这会做。 橙色轮廓不会再显示出来。

Answer 3

Bootstrap 3.1.1目前的答案并不适用于我。 这是我必须重写：

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

Answer 4

 <input style="border:none" > 

为我工作得很好。 希望有它固定在HTML本身… 🙂

Answer 5

我find了解决scheme。
我用： outline:none; 在CSS中，它似乎已经工作。 无论如何，感谢您的帮助。 🙂

Answer 6

这从所有和任何元素中删除铬的橙色框架，不pipe它在哪里，在哪里

 *:focus { outline: none; } 

Answer 7

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

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

Answer 8

这一定会工作。 橙色轮廓将不再显示..所有标签的共同点：

 *:focus { outline: none; } 

特定于某个标签，例如：input标签

 input:focus { outline:none; } 

Answer 9

解

 *:focus { outline: 0; } 

PS：使用outline:0而不是outline:none焦点。 这是有效的，更好的做法。

Answer 10

我发现你也可以使用：

 input:focus{ border: transparent; } 

Answer 11

组

 input:focus{ outline: 0 none; } 

“重要”是为了以防万一。 这是没有必要的。 [现在它消失了。 -Ed。]