Question

您好我想摆脱单击文本字段并开始输入数据时出现的蓝色“光泽”。这是怎么做到的？

我是初学者所以我不是那么有经验的人。我的代码是：

<input type="text" name="search" size="40" value="Job Title e.g. Assistant Manager"  
style="background-color:white; border: 
solid 1px #6E6E6E; height: 31px; font-size:16px; 
vertical-align:0px;color:#bbb" 
onfocus="if(this.value == 'Job Title e.g. Assistant Manager'){this.value = 
'';this.style.color='#000'}" />

谢谢！

詹姆斯

Answer 1

此 CSS 代码段应适用于所有主流浏览器：

input:focus {
    outline:none;
}

如果没有，请尝试添加!important指令：

input:focus {
    outline:none !important;
}

Answer 2

您只需添加：

<style type="text/css">
#hello:focus
{
  outline:none;
}    
</style>



<input type="text" id="hello"></input>

喝彩！

Answer 3

可以在元素上使用以下样式属性，以避免出现蓝色边框。

style="box-shadow: none;"

例如：在这里，我已经在按钮中使用了

<button type="button" style="box-shadow: none;">Button</button>

Answer 4

尽管没有直接关系，但我在这里留下了注释，因为此SO页面正是我搜索到的。此处列出的答案也适用于html5视频。就我而言，Chrome中的视频下方显示了一个蓝色边框。

出于完整性考虑：

video 
{
  outline:none;
}

Answer 5

如果您想要简单的解决方案并希望从完整的html中删除蓝色边框，请使用

*:focus {outline:none !important}

单击表单输入字段时如何摆脱蓝色外边框？

5 个答案: