如何在Chrome中去掉输入框边框？

Question

在Chrome中，我的设计在搜索输入框的边缘有一个浅色边框或轮廓线。我该如何去掉它？

- conbask

---

请检查他们的答案，我只想加上“border:0px none;”。 - dragonjet

目前的解决方案似乎都不起作用。还有其他想法吗？ - conbask

你为什么想这样做呢？我觉得高亮功能非常有用。如果一个网站找到了禁用它的方法，我就不会使用它。我找不到我正在输入的位置。并不是每个人都使用鼠标来浏览互联网。 - Cody Gray

你的CSS似乎出了问题。在Chrome中，网站无法正确渲染。 - Cody Gray

抱歉，我的CSS出了问题。已经修复好了，提前感谢。 - conbask

Answer 1

如果您指的是蓝色的“发光”，请添加以下CSS代码：

outline: none;

- user578895

Answer 2

form#search input[type="search"] { 
    -webkit-appearance: none; 
}

请注意，这将禁用选择框中的箭头。

- seler

---

好的，由于你使用减号，你需要用引号转义你的搜索术语："-webkit-appearance"。 - Šime Vidas

Answer 3

input, select {
    outline: none;
}

这将禁用所有常规表单元素的浏览器轮廓。

- mystrdat

Answer 4

这段代码对我很有效：

input:focus {
    box-shadow: none;
}

- Ernesto Hegi

Answer 5

嘿，去掉轮廓线很容易。只需在CSS中将输入字段的outline属性设置为none即可。

例如：

form input[type=text]:focus, form input[type=password]:focus, textarea:focus {
    outline: none;
}

上述代码将在Chrome和Safari浏览器中移除表单元素焦点时的轮廓边框。

- gautamlakum