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

Question

我正在尝试删除此边框：

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

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

编辑：我认为这是标准行为，here你可以看到这个例子。我也在使用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上的大纲：标签

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

触发jQuery UI标签小部件

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

以HTML格式标记标记

<div id="my-tabs">
    <ul>
        <li><a href="#tab-1">Tab 1</a></li>
        <li><a href="#tab-2">Tab 1</a></li>
    </ul>
    <div id="tab-1"></div>
    <div id="tab-2"></div>
</div>

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＆amp;当您点击其他标签/鼠标离开悬停区域时，.ui-state-focus a停止显示轮廓

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

我遇到了同样的问题。 jQuery mobile在运行时应用类，我尝试了上面的解决方案，但它对我不起作用然后我删除了 ui-shadow 类表单<div data-role="navbar" class="ui-corner-all"> 这满足了我的要求。