单击时如何删除输入字段的边框（焦点指示）答案

【问题标题】：How to remove border(focus-indication) of input field while it is clicked单击时如何删除输入字段的边框（焦点指示）
【发布时间】：2018-11-20 12:55:59
【问题描述】：

我当然知道如何移除边框，但是当聚焦输入字段时，它有一个蓝色发光边框，.field:focus{border: none} 无法移除该边框。我对此一无所知，也找不到任何相关信息。

我的意思是状态字段周围的蓝色边框：

【问题讨论】：

标签： html css

【解决方案1】：

这是.field:focus{outline: none} 不是.field:focus{border: none}

【讨论】：

【解决方案2】：

您应该在输入字段的焦点上使用outline: none，如示例中所示

.field1, .field2{border:none}


.field2:focus{outline: none}

<input type="text" class="field1" placeholder="Input field1">
<br>
<input type="text" class="field2" placeholder="Input field2">

【讨论】：