去除激活链接虚线边框(ff+ie)

去除激活链接虚线边框(ff+ie)

• 2/1826
• stauren
• 1777d ago
•  

发现，a标签按下后，会有虚线边框
要隐藏的话，IE和FF中的处理是不同的

IE: 可以用onfocus="this.blur()" 或 hidefocus="ture" 或写css expression: a {blr:expression_r(this.onFocus=this.blur())}

FF: 可以用css中的outline:none 来设定

示例：
IE中点击无虚线
FF中点击无虚线
IE与FF皆无虚线

代码如下：
<a href="#" _fcksavedurl=""#"" onfocus="this.blur()">IE中点击无虚线</a>
<a href="#" style="outline: none;">FF中点击无虚线</a>
<a href="#" onfocus="this.blur()" style="outline: none;">IE与FF皆无虚线</a>

---

--- post by stauren from IP hidden at 2007-06-04 16:09 (1777d ago)

Comment #1 stauren@stauren (IP hidden) at 2007-06-04 16:27 (1777d ago)

嗯，举例中的3个链接点击后也全部没有边框
应该是和另一个东西冲突了。
嗯，证明，使用
document.onselectstart = function() {return false;};和
document.onmousedown = function (event) {event.preventDefault ()};
也是可以去除那个边框的

Comment #2 ytzong (219.133.62.73) at 2010-01-20 12:49 (816d ago)

IE CSS表达式这个要慎用
我之前同事为了a点击后去焦点（写的跟你这句差不多）
鼠标滑过的时候（一个弹出菜单，里面是链接列表）导致IE6 CPU飙到50%

http:///log/6ap7cyoix.html#

========================
经过本人测试，只需要一句CSS代码即可：

例如xhmtl代码如下：
<div class="logo"><a href="index.html"><img src="images/logo" /></a></div>
则去掉去除激活链接虚线边框的CSS代码如下：
.logo a{
 outline:none;
}
=====================
一切OK，兼容所有的浏览器。