jQuery UI – 删除焦点上的橙色标签边框

我想删除这个边框：

并且因为它仅在焦点上显示，所以我无法使用chrome控制台找到要覆盖的类。

有没有人这样做，知道我应该覆盖什么类？

编辑：我想这是标准行为， 在这里你可以看到这个例子。 我也在使用Chrome。

Answer 1

li a { outline-color: transparent; }​ 

Answer 2

快速解决方案：

解决方案是否要影响实际的.ui元素。

 .ui-state-active a, .ui-state-hover a { outline: none; } 

Anon和Konstantin D的回答有什么区别？

Anon正确地定位了“li标签”中的实际“标签”。 永远记住，那个tabs（）; 在未排序列表中使用“标签”。 要实际显示选项卡导航。

例：

CSS也会影响li：a标签的轮廓

 .ui-state-active a, .ui-state-hover a { outline: none; } 

触发jQuery UI Tabs小部件

 $('#my-tabs').tabs(); 

HTML中的标签标记

 
 
 
Tab 1
 
Tab 1
 
 
 
  

Answer 3

我喜欢Daniel的解决方案，我只想添加它：

 .ui-state-active a, .ui-state-hover a, .ui-state-visited a, .ui-state-focus a { outline: none; } 

.ui-state-visited a ＆ .ui-state-focus a停止它显示当你点击另一个标签/你的鼠标离开hover区域时的轮廓

Answer 4

我的答案是以上所有答案的混合简单和简短使用以下内容

 .ui-tabs .ui-tabs-nav li a { outline:none; } 

Answer 5

您可以覆盖ui-state-focus和ui-state-active css类。

 .ui-state-focus { border: none; outline: none; } .ui-state-active { border: none; outline: none; } 

在jQuery UI的情况下，覆盖ui-state-active 选项卡应该足够了。

更新 ：在您的情况下，这不是ui-state-active类，而是webkit中的常规锚概要。 我更新了你的小提琴： http ： //jsfiddle.net/ukPW6/4/

Answer 6

接受的答案适用于Firefox，但我在Mac上的Chrome中遇到了问题。
outline-style属性似乎为我解决了这个问题。

 .ui-state-focus { outline-style:none; } 

Answer 7

如果上面的解决方案仍然不起作用，那么它是由box-shadow属性引起的。 试试这个：

 .ui-state-focus:focus, .ui-state-focus, li a { box-shadow:none; } 

Answer 8

我遇到了同样的问题。 jQuery mobile在运行时应用类，我尝试了上面的解决方案，但它对我不起作用然后我删除了ui-shadow类窗体

满足了我的要求。