如何去除 Chrome 和 Safari 中文本框周围的黄色边框答案

【问题标题】：How to remove yellow border comes around the textbox in Chrome & Safari如何去除 Chrome 和 Safari 中文本框周围的黄色边框
【发布时间】：2013-08-15 22:23:50
【问题描述】：

我有一个 html 页面。当我在 chrome 或 Safari 中获取页面时，文本框周围有一个黄色边框。

为了去除边框，我添加了

<style type="text/css">
  input{
  outline:none;
}
</style>

边界也消失了。

但当我在 Mac 机器（chrome 和 Safari）中获取页面时，它仍然存在。有人知道如何在 Mac 中修复它吗？

【问题讨论】：

你知道the issues surrounding this吗？
感谢 MaVRoSCy。我会将其更改为 input:focus{}

标签： html css

【解决方案1】：

:focus {
  outline: 0;
  outline-color: transparent;
  outline-style: none;
}

【讨论】：

【解决方案2】：

你也可以试试不设置颜色：

.foo:active, .foo:focus {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

【讨论】：

【解决方案3】：

如果您使用的是引导程序的 CSS，则可能是罪魁祸首。在这里找到问题：

select:focus, input[type="file"]:focus, input[type="radio"]:focus, input[type="checkbox"]:focus {
  outline: thin dotted #333;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

如果您无法编辑 bootstap.css，请使用它，就像一个魅力。

select:focus, input:focus, textarea:focus {
  outline: 0;
  outline-color: transparent;
  outline-style: none;
}

【讨论】：