firefox的超链接点击去除扩大的难看虚线的解决方法
2024年05月18日
•
Css
•
我要评论
在某些特殊的情况下,比如做一个导航菜单的时候,出现这个情况时效果就很糟糕了,因为firefox会错误地扩大链接的边框: 在firefox的地址栏输入about:config,回车。有一个配置项叫做“b
在某些特殊的情况下,比如做一个导航菜单的时候,出现这个情况时效果就很糟糕了,因为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.
相关文章:
-
可以给img元素设置背景图
实现方法很简单:设置 img 元素为块元素(display:block;),并赋一个 padding 值。 根据上面的原理,举一反三,通过类似的方法,我们还可以...
[阅读全文]
-
-
-
CSS渐变统计柱形图
用作图工具作一个渐变的长度.看起来能好看一点(宽:187px;高15px) 本来设想是当12%时,图片从左到12%的位置显示,余下的88%不显示,但不占地(看起...
[阅读全文]
-
div+CSS 兼容小摘
区别ie6与ff: background:orange;*background:blue; 区别ie6与ie7: background:green !impor...
[阅读全文]
-
版权声明:本文内容由互联网用户贡献,该文观点仅代表作者本人。本站仅提供信息存储服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 2386932994@qq.com 举报,一经查实将立刻删除。
发表评论