css - Firefox 和 IE 中的 ul 样式

Question

我有这个小提琴http://jsfiddle.net/rd2Hc/11/

当在 IE 中单击时，在 IE 中的 li 周围会出现虚线边框，但在 Firefox 中不会发生。有没有办法在 Firefox 中获得它。

<ul>
    <li>
     <a tabIndex="-1" class="ui" id="ui-id-17"  href="#tabs-1">
         Content
         </a>
    </li>
    <li>
        <a tabIndex="-1" class="ui" id="A1" href="#tabs-1">
            People
         </a>
    </li>
    <li>
        <a tabIndex="-1" class="ui" id="A2" href="#tabs-1">
            Test
         </a>
    </li>

Answer 1

是的，有办法。使用 a 标签的属性outline和状态，active or focus只需将此行放入您的 Css

a:active, a:focus {
   outline:#00FF00 dotted thin; /*Change the values that you want*/
}

你可以在这里看到这个运行http://jsfiddle.net/rd2Hc/7/

Answer 2

虚线边框是因为outlineCSS 中的默认属性。您可以修改大纲属性来这样做：

a:active, a:focus {
    outline: 1px dotted #ccc;
}

http://jsfiddle.net/teddyrised/rd2Hc/12/