去除IE和Firefox中链接的虚线框

发布于：电脑网络, 转来载去 1,068 次践踏

在回访 whisperer 的网站时，让我发现了一篇很有意思也很实用的文章——《去除IE和Firefox中链接的虚线框》，这个标题就够吸引我的了。细心的同学会发现在 IE 和 Firefox 下点击超链接会产生一个虚线框，（居 whisperer 童鞋说在 Chrome 和 Opera 浏览器中是没有的）这个虚线框非常影响美观，我们有必要将其除之而后快！

下面我就介绍一下如何在 WordPress 中实现消除链接元素周围的虚线框。

1、把下面代码保存为一个扩展名为 .htc 的文件（或者直接下载我的文件）：

<public:attach event="onfocus" onevent="example()"/>
<script language="javascript">
function example(){
this.blur();
}
</script>

把这个文件上传到你的网站上，得到一个地址。

2、修改你当前主题的 style.css 文件，追加以下代码：

a {behavior:url(你的.htc文件地址)}  /*去除IE中的链接虚线框*/
a:focus{outline:0;}  /*去除Firefox中的链接虚线框*/

保存之后就可以了，享受没有虚线框束缚的美感吧。

原文链接：http://www.whisperer.name/2009/08/removing-the-dashed-box-around-links/

  1. Pingback: 去除IE和Firefox中链接的虚线框 | PeeMa.us

  8. 有 css, 有 jQ, 有 htc.... 太多方法了. 我是用 jQ, 反正 jQ 已經掛上了, 多加一行代碼而已.
    $('a,input[type="submit"]').bind('focus',function(){if(this.blur){ this.blur();}});

    • 谢谢willin大师的提议，我找到一个纯CSS的方法，已经用上了，感觉比htc的好，用htc的方法页面会加载上百项，给每个链接都加载一遍，很恐怖

      • 確定有 jQ.
        代碼加在全部頁面會加載的 js 文件中---
        $(function(){ ... } 或 jQuery((function(jQuery){ ... } 的裏面.
        在不影響其它程序的地方.
        順便提一下: 上式選擇器挑的是 a 和 input[type="submit"]
        如果還有其它需求也可加, 如: img, object...
        方法很多, 其實所有 blur 功能的方法都可以,
        不同的是: css, htc 是在服務器執行, js 是在客戶端執行.