禁用 Webkit 表单输入阴影 [重复]

Posted 2023-02-22

【中文标题】禁用 Webkit 表单输入阴影 [重复]

【英文标题】：Disabling Webkit Form Input Shadow [duplicate]

【发布时间】：2011-01-23 07:03:38

【问题描述】：

可能重复：How to remove border around text/input boxes? (Chrome)

有没有办法在表单元素获得焦点时禁用 Webkit 浏览器生成的彩色阴影？它在 Chrome 中为黄色，在 Safari 中为蓝色，妨碍了我尝试实现的任何自定义焦点样式。

【问题讨论】：

它被称为框架或边框，而不是阴影。

【参考方案1】：

试试这个：

input:focus 
    outline: none;

【参考方案2】：

您可以尝试outline: none，但请注意，出于可用性原因，这通常不是真正可取的。始终牢记Jakob Nielsen's“网络用户体验法则”：

用户将大部分时间花在其他网站上。

这意味着他们会根据大多数其他网站上的常见做法来形成对您网站的期望。如果您偏离，您的网站将更难使用，用户会离开。