当一个HTML元素被“聚焦”(当前选中/标签进入)，许多浏览器(至少Safari和Chrome)会在它周围放一个蓝色边框。
对于我正在工作的布局，这是分散注意力，看起来不正确。
<input type="text" name="user" class="middle" id="user" tabindex="1" />
Firefox似乎没有这样做，或者至少，会让我控制它:
border: x;
如果有人能告诉我IE的表现如何，我会很好奇。
让Safari删除这一点闪光会很好。
当前回答
焦点上的文本区域可能有框影..可以像这样删除:
textarea:focus{
outline: none!important;
box-shadow: none!important;
}
其他回答
在Bootstrap 4中，您可以使用阴影-none来删除边界轮廓，它将删除焦点轮廓。
<div class="form-group">
<label for="exampleInputEmail1">Name</label>
<input type="text" class="form-control form-control shadow-none"
id="exampleInputEmail1"aria-describedby="emailHelp">
</div>
如果上面的解决方案不起作用，你可能正在使用bootstrap，因此.form-control类在默认情况下将box-shadow css属性应用到输入字段。
解决方案是:
.form-control {
box-shadow: none;
}
您可以使用:outline:none删除文本/输入框周围的橙色或蓝色边框(outline)
input {
background-color: transparent;
border: 0px solid;
height: 20px;
width: 160px;
color: #CCC;
outline:none !important;
}
你可以使用CSS来禁用它! 这是我用来禁用蓝色边框的代码:
*:focus {
outline: none;
}
这是一个实际的例子
这是一个旧线程，但作为参考，重要的是要注意，不建议禁用输入元素的大纲，因为它阻碍了可访问性。
outline属性的存在是有原因的——为用户提供一个清晰的键盘焦点指示。有关该主题的进一步阅读和其他来源，请参阅http://outlinenone.com/
