消除超链接点击虚线框问题
在网页中凡是添加了超级链接的对象，不管是文字还是图片，在点击的时候都会出现一个虚线框，有时候会觉得很影响页面的美观，也许你的boss也是个完美主义者，那么下面将会整理从google搜来的4种解决方案来想消除这不太受欢迎的虚线框。
非IE浏览器里一般用 a:focus { outline:0; }这句来搞定
1、首先有利用htc来解决的。
htc 是什么呢？htc全称就是Html Components，由微软在IE5.0后开始提供的一种新的指令组合，它可以把某种特定功能的代码封装在一个组件之中，从而实现了代码的重复使用。作为一个组件，htc里包含了属性、方法、事件等等各种知识，在这里就不一一介绍了，具体内容各位可以参考微软的msdn主页。现在言归正传，看看htc是怎么批量消除链接虚线框的：
①首先将下面的代码保存为.htc扩展名的文件；
View Code JS
| <public:attach event="onfocus" onevent="hscfsy()"/> <script language="javascript"> function hscfsy(){ this.blur(); } </script> |
②然后在网页文件的<style>标签内或着外链的CSS文件里添加如下一行代码即可：
View CodeCSS
| a {behavior:url(htc文件所在路径地址)} |
2、使用CSS中Expression来解决。
跟第一个方法相比，此方法要简单得多，不需要创建htc文件，只需在网页文件的<style>标签内或着外链的CSS文件里添加如下一行代码即可：
View CodeCSS
|
a{blr:expression(this.onFocus=this.close());} /* 只支持IE，过多使用效率低 */ a{blr:expression(this.onFocus=this.blur());} /* 只支持IE，过多使用效率低 */ a:focus { -moz-outline-style: none; } /* IE不支持 */
outline：none；
|
3、使用JS脚本来解决。
代码如下，复制到网页文件的<head>标签内即可。
View Code JS
| <script type="text/javascript">window.onload=function() { for(var ii=0; ii<document.links.length; ii++) document.links$[$ii$]$.onfocus=function(){this.blur()} }</script> |
5、同样是使用JS脚本的方法。
代码如下，复制到网页文件的<head>标签内即可。
View Code JS
|
<script type="text/javascript">function fHideFocus(tName){ aTag=document.getElementsByTagName(tName); for(i=0;i<aTag.length;i++)aTag$[$i$]$.hideFocus=true; for(i=0;i<aTag.length;i++)aTag$[$i$]$.onfocus=function(){this.blur();}; }</script> |
4、其他解决方法
首先是FF
只需要加上一个属性就可以了 outline：none； 这样在ff里边就不显示了
再次就是IE
ie里边就没有css属性可控制了， 那怎们办那 其实可以在html控件上加一个属性 hidefocus=“true”；
好了 你可以测试下
<a hideFocus style="outline:none;" alt="测试文字"href=#">测试文字</a> |
浙公网安备 33010602011771号