协慌网

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

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

此边框用于显示元素是否已聚焦（即您可以键入输入或按 Enter 按钮）。但是你可以删除它：

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

您可能希望为用户添加一些其他方式，以便知道哪些元素具有键盘焦点，但可用性。

Chrome 还会将突出显示应用于其他元素，例如用作模态的 DIV。为了防止在这些元素和所有其他元素上突出显示，您可以执行以下操作：

*:focus {
    outline: none;
}

使用 Bootstrap 3.1.1，当前的答案对我不起作用。这是我必须覆盖的内容：

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

input:focus {
    outline:none;
}

这样做。橙色轮廓将不再显示。