如何去除点击后的虚线

outline:none 所有浏览器都支持 outline 属性。

定义和用法

outline （轮廓）是绘制于元素周围的一条线，位于边框边缘的外围，可起到突出元素的作用。

注释：轮廓线不会占据空间，也不一定是矩形。

outline 简写属性在一个声明中设置所有的轮廓属性。

可以按顺序设置如下属性：

• outline-color
• outline-style
• outline-width

如果不设置其中的某个值，也不会出问题，比如 outline:solid #ff0000; 也是允许的。

网上大多的解决方案是：

1、a {outline: none; star:expression(this.onFocus=this.blur());}

调用js比较频繁的情况下，建议用：

2、a:active {outline: none; star:expression(this.onFocus=this.blur());}

写在a:active里，意思就是点击时才执行，才去掉虚线框。这样鼠标在放上A和默认的情况下就不会太耗资源。

最好兼容效果：

a {outline: none;}
a:active {star:expression(this.onFocus=this.blur());}

=== Chrome, Safari ===
这两个浏览器在点击链接时本身没有虚线框

=== Jquery ===
如果你使用Jquery框架的话，可以添加以下代码即可实现

$("a").bind("focus",function() {
    if(this.blur) {this.blur()};
});

终极解决方案：

a {outline: none;}
a:active {star:expression(this.onFocus=this.blur());}
:focus { outline:0; }

我认为还是：a:focus { outline:none;-moz-outline:none;} /*focus为获取焦点的伪类*/  比较好用的

 

转载于:https://www.cnblogs.com/Better-Me/p/4159694.html