CSS - 删除输入字段活动突出显示
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15453488/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS - Removing input field active highlight
提问by Kizer Yakuza
Using only html and css, how do I disable the blue (in Firefox) highlight color around an active input field.
I've tried using input {outline:none;}but with no success.
Thanks for the help! =)
仅使用 html 和 css，如何禁用活动输入字段周围的蓝色（在 Firefox 中）突出显示颜色。我试过使用input {outline:none;}但没有成功。谢谢您的帮助！=)
ok,ignoring the previous code about outline, I chose the wrong property to change. What I'm trying to get is to simply remove the highlighting (whatever browser, its the bold and colored border that appears) around an active form input field, without changing or disabling the styling. Thanks =)
好吧，忽略之前关于outline的代码，我选择了错误的属性来改变。我想要得到的是简单地删除活动表单输入字段周围的突出显示（无论是什么浏览器，它出现的粗体和彩色边框），而不更改或禁用样式。谢谢=)
回答by Paula Fleck
You have to use :focus declaration. In this case:
您必须使用 :focus 声明。在这种情况下：
input:focus {outline:none;}
All the input's in your project won't have the blue border.
项目中的所有输入都不会有蓝色边框。
If you want a specific attribute, use this:
如果你想要一个特定的属性，使用这个：
input[type=text]:focus {outline:none;}
Hope it helps. =)
希望能帮助到你。=)
回答by ohcibi
回答by Alex Shesterov
input {border:0; outline:none;}
should remove all borders/outlines.
应该删除所有边框/轮廓。
回答by Jason Slade
The answer is simpler than I reliased:
答案比我想象的要简单：
box-shadow:none;
回答by Azragh
Edit: my solution was way to complicated. It's simple as that:
编辑：我的解决方案很复杂。就这么简单：
input:focus {
outline: none;
}
You need to target the :focus state.
您需要针对 :focus 状态。
回答by Blieque
To remove the highlight try adding this rule to the input field(s):
要删除突出显示，请尝试将此规则添加到输入字段：
-moz-appearance:none;
This can also be done for WebKit based browsers using the respective prefix:
这也可以使用相应的前缀为基于 WebKit 的浏览器完成：
-webkit-appearance:none;
This should take care of any borders, outline, etc. using just one CSS property.
For browsers other than the WebKit pair and Firefox - Opera and IE - it's advisable to include borderand outlineproperties too, ensuring browser cross-compatibility.
这应该只使用一个 CSS 属性来处理任何边框、轮廓等。对于 WebKit 对和 Firefox（Opera 和 IE）以外的浏览器，建议也包含border和outline属性，以确保浏览器的交叉兼容性。
回答by Smilez
add !importantand define the color/background-color in your css file.
!important在 css 文件中添加并定义颜色/背景颜色。
#title {
font-size: 40px;
color: black !important;
}
回答by quas
button {
-webkit-tap-highlight-color:transparent;
-moz-tap-highlight-color:transparent;
-o-tap-highlight-color:transparent;
tap-highlight-color:transparent;
}
回答by Mark
This should work for most input types on Firefox:
这应该适用于 Firefox 上的大多数输入类型：
input::-moz-focus-inner { border: 0; }
