CSS - 删除输入字段活动突出显示

Question

仅使用html和css，如何禁用活动输入字段周围的蓝色（在Firefox中）高亮颜色。 我尝试使用input {outline:none;}但没有成功。 谢谢您的帮助！ =）

好吧，忽略前面关于大纲的代码，我选择了错误的属性来改变。我想要的是简单地删除活动表单输入字段周围的突出显示（无论浏览器，它出现的粗体和彩色边框），而无需更改或禁用样式。谢谢=）

Answer 1

你必须使用：焦点声明。 在这种情况下：

input:focus {outline:none;}

项目中的所有输入都没有蓝色边框。

如果您需要特定属性，请使用：

input[type=text]:focus {outline:none;}

希望它有所帮助。 =）

Answer 2

请参阅此fiddle。

您似乎必须设置一些border属性才能使outline: none正常工作。如果您在border指令中发表评论，则轮廓会消失。

Answer 3

input {border:0; outline:none;}

应删除所有边框/大纲。

Answer 4

答案比我更简单：

box-shadow:none;

Answer 5

编辑：我的解决方案很复杂。这很简单：

input:focus {
  outline: none;
}

您需要定位：焦点状态。

Answer 6

要删除突出显示，请尝试将此规则添加到输入字段：

-moz-appearance:none;

这也可以使用相应的前缀为基于WebKit的浏览器完成：

-webkit-appearance:none;

这应该只使用一个CSS属性来处理任何边框，轮廓等。 对于除WebKit对和Firefox之外的浏览器 - Opera和IE - 建议同时包含border和outline属性，以确保浏览器的交叉兼容性。

Answer 7

button {
    -webkit-tap-highlight-color:transparent;
    -moz-tap-highlight-color:transparent;
    -o-tap-highlight-color:transparent;
    tap-highlight-color:transparent;
}

Answer 8

添加!important并在CSS文件中定义颜色/背景色。

#title {
    font-size: 40px;
    color: black !important;
}

Answer 9

这适用于Firefox上的大多数输入类型：

input::-moz-focus-inner { border: 0; }