通过CSS定义去掉页面中点击a链接和button等外的虚框

方法1，利用.htc文件（好像此方法仅适合IE）：

 

利用.htc文件来轻而易举地实现成批去除超链虚框。以下内容保存为后缀名为.htc的文件：

 

1.        <public:attach event="onfocus" />

 

2.        <script language="java script">

 

3.        function quit(){

 

4.        this.blur();

 

5.        }

 

6.        </script>

 

然后，在需要去除超链虚框的页面的<head>和</head>之间加入：
<style type="text/css">
a {behavior:url("htc文件")} /*注意htc文件的存放路径，如果此句放在css文件里更应注意路径问题*/
</style>

 

如果页面已经有了css文件，只需要将 a {behavior:url("htc文件")} 一句插入里面即可。这样，该页面的超链在点击之后的虚框将不复存在，页面显得干干净净。

 

方法2，css样式表里加如下代码（此方法可容适合IE和firefox）：

 

去掉链接时的虚框只要在你的样式表中加入以下代码,就可以去掉链接时烦的的虚框　

 

1.        a,area { blr:expression(this.onFocus=this.blur()) } /* for IE7.0及以下版本*/

 

2.        :focus { outline-style: none; } /* for Firefox，IE8.0等 */　

 

注：此方法用在默认提交Button按钮上，在IE7.0及以下版本将失去"Enter"键自动提交功能，所以方法2也可用去清除“提交”按钮自动提交功能！

 

方法3：去掉默认提交Button外面的虚框，同时保留默认键盘"Enter"键提交功能

 

1.        .button { hide-focus:expression(this.hideFocus=true); } /* for IE7.0及以下版本 */

 

2.        .button:focus { outline-style:none; }/* for Firefox，IE8.0等 */　

                  

posted @ 2010-11-04 16:10  栈长  阅读(154)  评论(0)  编辑  收藏  举报