以前一直用的方法都是:

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

后来发现有瑕疵,不完美。体现在页面调用JS动作比较频繁的情况下,页面很卡~~~半个月内遇到两次这个问题,都是自己公司的平台。而网上却没有关 于这个的说法·~~而大家也都是按部就班,我不得不写一写。

解决办法就是写成这样:

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

有 的人怀疑,未什么不直接写在a里呢,为什么不这样写呢a {outline: none;star:expression(this.onFocus=this.blur());}, 这样不是可以包含了所有的A了吗?其实这样理论上是对的,原来我也这么用,原来也发现没什么问题,可最近在做另一个项目的时候,页面调用的JS比较多,问 题就来了~整个页面会很卡,起初找不到原因,一直抓狂~~~后来一个个排除原因,最终找到罪魁祸首竟然是CSS样式表·~~

因 为如果写在A里,那么不管是鼠标放上,鼠标点击,还是默认,都会执行 star:expression(this.onFocus=this.blur());, 这个代码相对于IE来说就是一个CSS的动作调用,和JS原理一样,页面资源耗不起啊,也算是IE的BUG吧~~~我们实现的效果是要点击的时候没有虚 线,所以就写在a:active里就可以了,意思就是点击时才执行,才去掉虚线框。这样鼠标在放上A和默认的情况下就不会卡。

要同时兼容IE和火狐浏览器,样式直接写成以下就可以:

a {outline: none;}
a:active {star:expression(this.onFocus=this.blur());}
也可以单独写:

===IE===
为链接添加onFocus事件
if(this.blur)this.blur()或者用IE的私有属性hideFocus="hide";

===Firefox===
添加CSS
:focus{outline:0}
该CSS可以作为全局存在,即在样式表中单独存在一行该代码即可时全页面的链接不带有虚线框

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

===Jquery框架===
如果你使用Jquery框架的话,可以添加以下代码即可实现(raycross 提供)
$(“a”).bind(“focus”,function() {
if(this.blur) {this.blur()};
});

最终我的用法是在CSS文件直接加入:

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

如果页面上只有一两个链接的话,直接加到<a>里面也行,就像这样

<a href=”#” onFocus=”this.blur()”><img src=”logo.jpg” border=0></a>

a标签点击后的虚线框问题的更多相关文章

  1. css去掉a标签点击后的虚线框,outline,this.blur()

    css去掉a标签点击后的虚线框,outline,this.blur() outline是css3的一个属性,用的很少.声明,这是个不能兼容的css属性,在ie6.ie7.遨游浏览器都不兼容. outl ...

  2. css去掉a标签点击后的虚线框

    outline是css3的一个属性,用的很少. 声明,这是个不能兼容的css属性,在ie6.ie7.遨游浏览器都不兼容. outline控制的到底是什么呢? 当聚焦a标签的时候,在a标签的区域周围会有 ...

  3. css去掉a标签点击后的虚线框(转自网络)

    outline是css3的一个属性,用的很少. 声明,这是个不能兼容的css属性,在ie6.ie7.遨游浏览器都不兼容. outline控制的到底是什么呢? 当聚焦a标签的时候,在a标签的区域周围会有 ...

  4. 【工作笔记四】去掉a标签超链接的虚线框的方法

    a{ blr:expression(this.onFocus=this.blur()); /* IE Opera */ outline:none; /* FF Opera */ } a:focus{ ...

  5. IE10中KendoUI treeview 点击后出现虚线框的解决方案

    在head中添加:<meta http-equiv="X-UA-Compatible" content="IE=edge"> 修改渲染模式即可.

  6. 去掉a标签点击后的虚边框

    a { cursor: pointer; text-decoration: none; hide-focus: expression(this.hideFocus=true); outline: no ...

  7. html a标签 图片边框和点击后虚线框的有关问题

    html a标签 图片边框和点击后虚线框的问题 一直在在chrome上开发自己的项目,今天上ie和firefix一看,真丑,a标签在使用图片时,多加了蓝色的边框,并且点击后所有a标签都会出现一个虚线框 ...

  8. 去掉点击a标签时产生的虚线框

    1.直接给a 标签添加属性:onfocus="this.blur()" 即可 For Example: <a onfocus="this.blur()" ...

  9. 去掉A标签的虚线框

    outline是css3的一个属性,用的很少. 声明,这是个不能兼容的css属性,在ie6.ie7.遨游浏览器都不兼容. outline控制的到底是什么呢? 当聚焦a标签的时候,在a标签的区域周围会有 ...

随机推荐

  1. 小白日记25:kali渗透测试之提权(五)--利用配置不当提权

    利用配置不当提权 与漏洞提权相比,更常见的方法.在大部分企业环境下,会有相应的补丁更新策略,因此难以通过相应漏洞进行入侵.当入侵一台服务器后,无法照当相应的补丁进行提权,可通过寻找是否存在配置不当进行 ...

  2. Eclipse插件的安装方法

    转自:http://blog.csdn.net/zhangyabinsky/article/details/7043435 Eclipse插件的安装有两种方法 :一个是在线安装,另一个就是手动安装. ...

  3. JavaWeb中的简单分页

    这次主要是讲解一下通过登录后对得到的数据进行分页,首先我们新建一个登录页面login.jsp,因为我们主要学习一下分页,所以登录验证的部分不再阐述,主要代码如下: <form action=&q ...

  4. 玩转Android之手摸手教你DIY一个抢红包神器!

    AccessibilityService是Google专门为残障人士设计的一个服务,可以让他们更方便的来操作手机.AccessibilityService一个主要功能是通过监听窗口的变化来判断用户当前 ...

  5. Log4Net(二)之记录日志到文档详解

    原创文章,转载必需注明出处:http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/log4net-%E4%BA%8C-%E4%B9%8B% ...

  6. linux的cron服务及应用

    Linux下的Cron用于定时执行设置的周期性指令,是Linux的内置服务,可以用以下的方法启动.关闭这个服务: /sbin/service crond start //启动服务 /sbin/serv ...

  7. 定义label标签宽度需要设置display:inline-block;

    label{    display:inline-block;     width:120px;    line-height:22px;    text-align: right;}

  8. BZOJ 3831

    3831: [Poi2014]Little Bird Time Limit: 20 Sec  Memory Limit: 128 MBSubmit: 121  Solved: 68[Submit][S ...

  9. CSS行高--line-height

    遇到的问题:在css中,不理解line-height:1与line-height:1px的区别 发现的过程:最近在学做一个网站的过程中,设置两行文字之间的行高时需要用到line-height,发现了这 ...

  10. asp中utf8不会出现乱码的写法

    <%@ CODEPAGE=65001 %> <% Response.CodePage=65001%> <% Response.Charset="UTF-8&qu ...