2012-02-15 109 views
61

如何使用纯CSS删除围绕选定文本输入框的蓝色发光?选中时从HTML文本输入中删除蓝色发光

+2

实际上,在谷歌浏览器中,它是橙色的。只是说;) – wecsam 2012-02-15 04:22:16

+1

@wecsam:我起初实际上很困惑,因为我很习惯Chrome的橙色轮廓。 :P – Purag 2012-02-15 04:23:36

回答

126

这应做到:

input:focus { 
    outline:none; 
} 

EDIT(2015年):如果你正在设计一个广泛的观众,记得大纲往往是谁通过键盘导航或需要用户的重要辅助功能更明显的视觉反馈。如果您删除了大纲,请确保定义替代的焦点状态,为用户提供适当的视觉反馈。

+15

有时** box-shadow:none **也是必需的 – styks 2013-09-24 17:15:43

+1

既不适用于Chrome浏览器,版本为45.0.2454.101 m' :( – Ciwan 2015-10-04 13:35:09

+0

由于浏览器限制为select> options属性大纲由shadowDOM处理。可以试试[This](http://harvesthq.github.io/chosen/)jQuery插件 – TechYogi 2016-03-14 11:16:43

14

我更喜欢一个很好的固体复位:

input, textarea, select, a { outline: none; } 

纲要“无”的锚标记上防止恐怖重点概述了很多Android浏览器。

+0

输入轮廓只允许在焦点上 – Anselm 2013-04-28 13:37:00

+0

我更喜欢这个。另外,'select:focus'似乎没有对我来说,我看不出这样做的问题,':focus'是不必要的明确的, – taylorcressy 2014-06-15 15:06:14

+0

我需要添加'!important'才能为我工作。 – JoeTidee 2016-03-30 22:04:01