如何重置/删除chrome的输入突出显示/焦点边框？
Jie*_*eng 348 css google-chrome focus border css3
我已经看到镀铬的边框较厚,:focus但在我的情况下,我也使用了border-radius.反正有没有删除？
Pek*_*ica 696
您应该能够使用它删除它
outline: none;
但请记住,这可能对可用性有害:很难判断一个元素是否被聚焦,当你使用Tab键遍历所有表单的元素时,这会很糟糕- 你应该以某种方式反映元素的聚焦.
- 这是Chrome的一个可怕的想法,但很好,他们很容易关闭.当然,如果你不做其他事情来表现出焦点,那么这是不好的做法,但是谁会做一些愚蠢的事情呢？这些天可能会有1%的网站看起来不错,因为每个人都在做一切完全自定义的事情.使用"标准"外观控件已成为过去. (15认同)
- 注意事项上的+1是非常糟糕的做法.它会使键盘使用非常烦人. (13认同)
- 是的.全局设置`outline:none`就像一些重置一样是错误的,因为它会降低键盘的可访问性,但是如果你有另一种反映焦点的清晰方法,那么移除`outline`就没问题了. (9认同)
- 我确实在`:focus`上更改了`background-color`和`color`属性/属性(无论你怎么称呼它)所以我猜它仍然可以 (6认同)
Geo*_*rge 114
我必须完成以下所有操作才能完全删除它
outline-style:none;
box-shadow:none;
border-color:transparent;
- 这应该是最佳答案,它是唯一一个完全消除焦点上的阴影/边框的答案. (19认同)
- 唯一有效的解决方案 (4认同)
- 最后我找到了一款适用于手机的产品! (2认同)
- 尝试过其他一些事情,但这是唯一有效的事情. (2认同)
- 这是唯一对我有用的 (2认同)
- 谢谢，为我工作！ (2认同)
小智 78
要删除默认焦点,请在默认的.css文件中使用以下内容:
:focus {outline:none;}
然后,您可以按元素或默认的.css单独控制焦点边框颜色:
:focus {outline:none;border:1px solid red}
显然red用您选择的十六进制代码替换.
您也可以保持边框不变并控制背景颜色(或图像)以突出显示该字段:
:focus {outline:none;background-color:red}
:-)
小智 21
这肯定会奏效.橙色轮廓将不再出现..所有标签的共同点:
*:focus {
outline: none;
}
特定于某些标签,例如:输入标签
input:focus{
outline:none;
}
noe*_*rex 16
border:0;
outline:none;
box-shadow:none;
这应该可以解决问题.
最简单的方法是使用这样的东西但注意它可能不那么好.
input {
outline: none;
}
希望这个对你有帮助.
问题是你已经有了一个大纲.Chrome仍然会改变一些东西,这真的很痛苦.我找不到要改变的地方:
.search input {
outline: .5em solid black;
width:41%;
background-color:white;
border:none;
font-size:1.4em;
padding: 0 0.5em 0 0.5em;
border-radius:3px;
margin:0;
height:2em;
}
.search input:focus, .search input:hover {
outline: .5em solid black !important;
box-shadow:none;
border-color:transparent;;
}
.search button {
border:none;
outline: .5em solid black;
color:white;
font-size:1.4em;
padding: 0 0.9em 0 0.9em;
border-radius: 3px;
margin:0;
height:2em;
background: -webkit-gradient(linear, left top, left bottom, from(#4EB4F8), to(#4198DE));
background: -webkit-linear-gradient(#4EB4F8, #4198DE);
background: -moz-linear-gradient(top, #4EB4F8, #4198DE);
background: -ms-linear-gradient(#4EB4F8, #4198DE);
background: -o-linear-gradient(#4EB4F8, #4198DE);
background: linear-gradient(#4EB4F8, #4198DE);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4EB4F8', endColorstr='#4198DE');
zoom: 1;
}
