zoukankan      html  css  js  c++  java
  • 如何去掉超链接激活时的边框线

    一般情况下,点击一个超链接,会在这个链接上出现一个虚线的边框虚线,实际上通过响应onfocus事件去掉该边框,比如

    <a href="#" onfocus=this.blur()>NinGoo</a>

    当然,要是这样去修改网站中所有的链接来实现该效果,肯定是不现实的。通过在CSS的链接属性里加一条语句,可以做到批量修改:

    a {blr:expression(this.onFocus=this.blur());}

    注:这个只有IE才有效果,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.

  • 相关阅读:
    (水题)洛谷
    (水题)洛谷
    洛谷
    (水题)洛谷
    POJ
    poj 3061(二分 or 尺取法)
    poj 2456(二分)
    poj 1064(二分答案)
    POJ 2559(单调栈)
    STL
  • 原文地址:https://www.cnblogs.com/TSPWater/p/1735302.html
Copyright © 2011-2022 走看看