当前位置:  编程技术>WEB前端

去除链接元素的虚线框 兼容IE7、IE6、FF

    来源: 互联网  发布时间:2014-10-04

    本文导语:  推荐下面的代码 代码如下:a {outline: none; /* for Forefox */ }   a {star:expression(this.onFocus=this.blur()); /* for Ie*/ } 下面的代码比较麻烦 我们采用htc文件的办法来解决这个问题。首页将以下代码保存为link.htc文件。   代码...

推荐下面的代码
代码如下:

a {outline: none; /* for Forefox */ }  
a {star:expression(this.onFocus=this.blur()); /* for Ie*/ }

下面的代码比较麻烦
我们采用htc文件的办法来解决这个问题。首页将以下代码保存为link.htc文件。  
代码如下:
 
   
   
function hscfsy(){   
this.blur();   
}   
  
 
  在HTML文件中写入以下代码,建立一个链接:  
  
  我们开始为此链接定义CSS样式:  

a {   
  display:block;   
  width:100px;   
  height:30px;   
  line-height:30px;   
  text-align:center;   
}  
a:hover {   
  background:#ddd;  
}  
  CSS样式确定了链接的外观,具有一定宽度与高度的块元素。文字水平左右均居中对齐。  
  我们在a标签的样式内,加入一条属性。用此消除链接的虚线边框:  

a {   
  display:block;   
  width:100px;   
  height:30px;   
  line-height:30px;   
  text-align:center;   
  behavior:url(/tech-webtech/line.htc);  
}  
  我们运行以下代码查看效果:  
DIVCSS实例教程:去除链接元素的虚线框 - www. a { display:block; width:100px; height:30px; line-height:30px; text-align:center; overflow:hidden; behavior:url(/tech-webtech/attachments/month_0805/line743_52css.htc)} a:hover { background:#ddd; } 55CSS.com
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

我们在IE7、IE6中预览,已经没有问题了。但是在FF中虚线框依然存在。 
  我们新增一条样式定义来解决此问题。 
代码如下:

a:focus { outline:0; }

查看最终的运行效果: 
DIVCSS实例教程:去除链接元素的虚线框 - www.52CSS.com a { display:block; width:100px; height:30px; line-height:30px; text-align:center; overflow:hidden; behavior:url(/tech-webtech/attachments/month_0805/line743_52css.htc)} a:hover { background:#ddd; } a:focus { outline:0; } 55CSS.com
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

在IE7、IE6、FF中均成功实现了消除链接的虚线框。 

    
 
 
 
本站(WWW.)旨在分享和传播互联网科技相关的资讯和技术,将尽最大努力为读者提供更好的信息聚合和浏览方式。
本站(WWW.)站内文章除注明原创外,均为转载、整理或搜集自网络。欢迎任何形式的转载,转载请注明出处。












  • 相关文章推荐
  • PHP去除html标签,php标记及css样式代码参考
  • java去除集合中重复元素示例分享 java去除重复
  • php使用strip_tags从字符串中去除html标记
  • 去除php注释和去除空格函数分享
  • Python通过正则表达式获取,去除(过滤)或者替换HTML标签的几种方法
  • 如何去除linux安装时多余的启动项
  • 在linux命令模式下绘制的窗口里的光标如何去除?
  • sqlserver中去除字符串中连续的分隔符的sql语句
  • jQuery Trim去除字符串首尾空字符的实现方法说明
  • 用python实现的去除win下文本文件头部BOM的代码
  • mysql中如何去除小数点后面多余的0
  • asp去除html标记与空格的正则
  • 去除段首段尾的 和全角的空格的正则
  • 如何去除批处理虚拟机产生的dos黑框?
  • 请问如何才能将大量文件合并成一个文件并去除所有空行?
  • 怎么样去除浏览器中的滚动条,而采用内部的滚动条!
  • 如何去除LINUX造成的C盘启动程序
  • vi使用的问题,怎样去除查找后的高亮显示?
  • 怎么去除SWAP的内存?
  • SQL分组排序去除重复实例
  • 怎样将活动分区标志去除?????(急)


  • 站内导航:


    特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!

    ©2012-2021,,E-mail:www_#163.com(请将#改为@)

    浙ICP备11055608号-3