css焦点不能在safari和chrome工作

我有一个我从来没有遇到的奇怪的问题.请看这段代码：

css：

#btn{
    margin-left:150px;
    padding:10px;
    display:block;
}
#btn a{
    padding:5px 20px;
    background:green;
    color:#FFF;
    text-decoration:none;
    outline:none;
}
#btn a:hover{
    background:#933;    
}
#btn a:focus,#btn a:active{
    background:#CF0;
color:#000;

}

这里是HTML

<div id="btn">
   <a href="#">Click here</a>
</div>

焦点和活跃的css在Firefox中运行良好,但不能在chrome和safari中运行.

解决方法

是的,似乎在webkit中的焦点似乎很少.不是真的是一个bug.轻松修复在html.只需使用tabindex.

<a href="#" class="hide" tabindex="1">[hide]</a>
     <a href="#" class="show" tabindex="2">[show]</a>

塔达

原文地址：https://www.jb51.cc/css/214360.html