CSS去掉A标签（链接）虚线框的方法
发布时间：2014-04-01 16:30:44 作者：佚名 
我要评论
我要评论链接的虚线框影响整体风格，我们在工作经常会将它去掉，而采用图片高亮的方式来显示焦点状态。然而去掉虚线框在两种浏览器中却分别对待，这种技巧经常用到，作个记录，以备不时之需
当一个链接得到焦点时，默认会有个虚线框。如图：
在 Firefox 里可以用 -moz-outline:none; 或者 outline:none; 来将其去掉。所以我们可以这样写：
复制代码
代码如下:a:focus {
outline:none;
-moz-outline:none;
}
outline:none;
-moz-outline:none;
}
顺便提一下，如果你用过 Safari 和 Chrome 可能会发现，当输入框得到焦点时边框会出现阴影效果。
如果想去掉阴影效果也可以用 outline 属性。
复制代码
代码如下:input,textarea {
outline:none;
}
outline:none;
}
言归正传，刚刚说的是 Firefox ，现在说说 IE。首先比较遗憾，还没有找到通过 CSS 去掉 IE 链接虚线框比较好的解决办法。所以只能用一个替代的办法，就是 a 标签的 hidefocus 属性(这个属性是 IE 独有的)。
复制代码
代码如下:<a href="#" hidefocus="true">链接</a>
注意：JS 脚本对应的属性名是：hideFocus。对应的 JS 代码应该是：
复制代码
代码如下:xxx.hideFocus ="true";
还有一种不推荐的办法。就是让链接得到焦点的时候失去焦点。
复制代码
代码如下:<a href="#" onfocus="this.blur();">链接</a>
这种办法很管用，但过于暴力，最好不要用了。
相关文章
jQuery JavaScript与CSS开发入门经典((约克).施宏斌等著) PDF [42M]
浓墨重彩地描述iQuery的API及iQuery框架的所有基础知识，在实例引导下演示如倒使用iQuery架以超越纯JavaScrjpt的速度实现更多功能，以及如何使用最少代码完成繁琐任务2013-03-27使用jQuery 学习JavaScript和CSS开发 英文版
Beginning JavaScript and CSS Development with jQuery2009-11-26- 昨天在看别人blog的时候发现DW有这么一个东西。叫做代码片断。 我们可以将常用的css定义写一个代码片断。保存在DW中，作为公用库。当再次写新的css的时候可以直接插2008-10-17
如果你还在愁怎么发展国外潜在客户，如果你对网络营销并不那么精通，别担心，这一切都交给外贸客户开发助手2013-10-24
外贸客户挖掘机是一款可以收集客户联系资料，发送广告内容将变的简单一体化，鼠标点点即可完成的软件工具2013-10-14- RGBa是一种在CSS中声明包含透明效果的颜色的方法，通过RGBa，我们可以将一个元素设置为透明，而不会影响其子元素，下面有个不错的示例，大家可以参考下2014-04-01
- 恶搞的内容有网页上下颠倒、网页旋转、网页中所有图片上下颠倒、网页中所有图片都自转、网页倒在地上了等等，下面是对应的代码，有些网站会不起作用，往下翻网页，有种自由2014-04-01
- css样式，想必很多从事网页布局的朋友对它很熟悉吧，常见的用法就不说了，本文主要为大家介绍下css样式的零碎用法包括样式的动态添加及样式的显示和隐藏等等，喜欢的朋友可2014-04-01
- 有一个小脚本能够做到让 IE6, 7和 8支持CSS3，包括：border-radius (rounded), box-shadow ( shadow), text-shadow等2014-03-31
CSS自定义select下拉选择框的样式(不用其他标签模拟)
怎么自定义select下拉选择框的样式，使用纯CSS实现，把浏览器默认的样式覆盖掉还是有其他的方法，select靠纯CSS是不能解决这个自定义样式问题，下面为大家讲解下CSS实现的2014-03-31
最新评论