firefox的超链接点击去除扩大的难看虚线的解决方法_ Div+Css教程-查字典教程网
firefox的超链接点击去除扩大的难看虚线的解决方法
firefox的超链接点击去除扩大的难看虚线的解决方法
发布时间:2016-12-29 来源:查字典编辑
摘要:在某些特殊的情况下,比如做一个导航菜单的时候,出现这个情况时效果就很糟糕了,因为Firefox会错误地扩大链接的边框:在Firefox的地址...

在某些特殊的情况下,比如做一个导航菜单的时候,出现这个情况时效果就很糟糕了,因为Firefox会错误地扩大链接的边框:

在Firefox的地址栏输入about:config,回车。有一个配置项叫做“browser.display.focus_ring_width”,把它修改成0,点击链接时就不会出现那个边框。但这样的话,在焦点落在按钮上时也没有了边框指示。而且作为一个开发者,在浏览器里设置这个属性,无异于掩耳盗铃。

这实际上是Firefox在<a>这个标签处于focus状态时(pseudo selector - a:focus)给它加的outline属性。

正确的解决办法是在CSS里加一个规则:

a {

outline: none;

}

或者缩小范围:

a:focus {

outline: none;

}

后者使得鼠标左键在链接上按下,松开之前的这段时间里,仍会显示虚线的outline.

在我看到的大部分网站中,都把这条规则写在CSS里。或许Firefox该考虑去掉这个的默认outline.

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新 Div+Css教程学习
    热门 Div+Css教程学习
    网页设计子分类