zoukankan      html  css  js  c++  java
  • 去掉虚线框兼容所有浏览器

    当一个链接得到焦点时,默认会有个虚线框。如图:

    链接虚线框

    在 Firefox 里可以用 -moz-outline:none; 或者 outline:none; 来将其去掉。所以我们可以这样写:

    a:focus {
        outline:none;
        -moz-outline:none;
    }


    顺便提一下,如果你用过 Safari 和 Chrome 可能会发现,当输入框得到焦点时边框会出现阴影效果。

    safari和chrome的默认输入框

    如果想去掉阴影效果也可以用 outline 属性。

    input,textarea {
        outline:none;
    }

    言归正传,刚刚说的是 Firefox ,现在说说 IE。首先比较遗憾,还没有找到通过 CSS 去掉 IE 链接虚线框比较好的解决办法。所以只能用一个替代的办法,就是 a 标签的 hidefocus 属性(这个属性是 IE 独有的)。

    <a href="#" hidefocus="true">链接</a>

    注意:JS 脚本对应的属性名是:hideFocus。对应的 JS 代码应该是:
    xxx.hideFocus = ‘true’;

    还有一种不推荐的办法。就是让链接得到焦点的时候失去焦点。

    <a href="#" onfocus="this.blur();">链接</a>
  • 相关阅读:
    Node入门--事件模块
    Node入门--1--module&require
    Node入门--1-->Hello World
    文件上传(StringMVC)
    StringMVC
    Spring基础
    手动添加日期到mysql数据库
    aspectj 注解
    HandlerMapping执行过程。。。
    在考试我打
  • 原文地址:https://www.cnblogs.com/zjx2011/p/2321341.html
Copyright © 2011-2022 走看看