删除任何样式的 jQuery 选项卡答案

【问题标题】：Remove any style jQuery tabs删除任何样式的 jQuery 选项卡
【发布时间】：2013-05-03 04:10:34
【问题描述】：

我正在使用 jquery 选项卡，但是当一个处于活动状态时，我得到了这个丑陋的边框：查看图片

我试图给标签一个类并设置它的样式（你可以看到它的绿色和蓝色文本），但没有什么能帮助删除它。

但由于某种原因，它不会有帮助

$(function() {
    $( "#more" ).tabs();
});

<div id="more">
      <ul id="cats">
        <li><a href="#alles">All</a></li>
        <li><a href="#web">Websites</a></li>
        <li><a href="#apps">Apps</a></li>
      </ul>
</div>

我可以设置任何样式，但蓝色边框不会消失

【问题讨论】：

您使用的是哪种浏览器？

标签： jquery tabs

【解决方案1】：

尝试将此添加到您的 CSS 中。

#more a
{  
    outline: none;  
}

正如其他人所说，这会影响某些用户的可访问性，但您可以将替代样式应用于选项卡以保留该可访问性...例如，更改焦点上的字体颜色：

#more a:focus
{  
    color: #f00;  
}

【讨论】：

【解决方案2】：

我认为这是浏览器的轮廓边框。您可以使用 CSS 将其删除，在标签中使用 outline:none;。

但请记住，轮廓是可访问性的一部分，因为它向用户显示了他的“标签”在哪里。因此，不能使用鼠标的用户会不知道他在哪里。

【讨论】：

嗯，好点子，但我可以创建一个活跃的课程并添加它，对吗？

【解决方案3】：

增加绿色背景栏的高度或内边距，然后简单地更改轮廓颜色以匹配该绿色。这样一来，可访问性就不会被剥夺，而且您仍然可以得到一个干净的外观。

【讨论】：