如何使用 jqueryui 摆脱关闭对话框按钮周围的蓝色光环？答案

【问题标题】：How do I get rid of this blue halo around the close dialog button with jqueryui?如何使用 jqueryui 摆脱关闭对话框按钮周围的蓝色光环？
【发布时间】：2014-05-24 22:47:50
【问题描述】：

我正在使用jquery ui 创建一个对话框，导入this style sheet。它在关闭按钮周围有这个烦人的光环。我很难摆脱它，因为一旦我单击光环，它就会消失（来自 jquery ui 的某种操作）——所以我看不到相关的 css 规则。我试图从 chrome 扩展中选择颜色（然后在 css 文件中搜索它），但是一旦我点击它就会消失。

我怎样才能让光环消失？回到默认的 x 就可以了。

【问题讨论】：

没有html很难判断
你能创建一个 js fiddle 吗？
老实说，确定是什么 css 导致某些东西看起来像这样的最好方法是使用所有你能想到的相关 css 可以做类似的事情，并尝试各种方法来关闭它。如果是按钮元素，默认显示蓝色光晕。否则，它可能只是一个边界。但我在样式表中没有看到。

标签： jquery css jquery-ui

【解决方案1】：

试一试：

.ui-button:focus { outline:none !important }

【讨论】：

【解决方案2】：

这确实是由outline 属性引起的。 Chrome 和 Internet Explorer 似乎会自动为所有焦点元素添加轮廓。我没有用 Firefox 找到任何东西。以下是使用 Chrome Inspector 进行查找的方法：

如果您不希望它在那里，您只需使用:focus 选择器定位元素并设置outline:none;。

【讨论】：