链接的虚线框影响整体风格,我们在工作经常会将它去掉,而采用图片高亮的方式来显示焦点状态。然而去掉虚线框在两种浏览器中却分别对待,这种技巧经常用到,作个记录,以备不时之需。
当一个链接得到焦点时,默认会有个虚线框。如图:
在 Firefox 里可以用 -moz-outline:none; 或者 outline:none; 来将其去掉。所以我们可以这样写:
a:focus {
outline :none ;
-moz-outline :none ;
}
顺便提一下,如果你用过 Safari 和 Chrome 可能会发现,当输入框得到焦点时边框会出现阴影效果。
如果想去掉阴影效果也可以用 outline 属性。
input,textarea {
outline :none ;
}
言归正传,刚刚说的是 Firefox ,现在说说 IE。
首先比较遗憾,还没有找到通过 CSS 去掉 IE 链接虚线框比较好的解决办法。
所以只能用一个替代的办法
,就是 a 标签的 hidefocus 属性(这个属性是 IE 独有的)。
< a href ="#" hidefocus ="true" > 链接</ a >
注意:JS 脚本对应的属性名是:hideFocus。对应的 JS 代码应该是:
还有一种不推荐的办法
,就是让链接得到焦点的时候失去焦点。
< a href ="#" onfocus ="this.blur();" > 链接</ a >
这种办法很管用,但过于暴力,最好不要用了。
转自:如何去掉链接虚线框
分享到:
相关推荐
介绍: 方法二: 在页面中加入下面CSS代码即可
介绍: 图片链接的虚线边框也可这样设置。
IE4 IE5中点击一个图片链接(实际是链接获得焦点)或者文字连接的时候,周围就会出现一圈讨厌的虚线框,用这个插件可以去掉
链接的虚线框影响整体风格,我们在工作经常会将它去掉,而采用图片高亮的方式来显示焦点状态。然而去掉虚线框在两种浏览器中却分别对待,这种技巧经常用到,作个记录,以备不时之需
细心的网友都会发现,以前在网页上显示Flash动画的地方,Flash的四周都会被一个虚线框包围着,当把鼠标放上的时候它就会出现,而且需要双击两次鼠标Flash的链接才生效,这样给用户带来了极大的不便,使用swfobject....
在前端制作的过程中会发现,一些文字/图片链接,或者一些input控件,在点击时会在周围出现虚线边框,一般会在火狐和IE浏览器下出现虚线框,谷歌下不会有。 这些虚线边框是作为对视觉设计的一种辅助,在不使用鼠标...
去掉a标签超链接的虚线框的方法,需要的朋友可以参考下。
我想很多朋友都遇到这个问题,当点击一个链接的时候,总会出现一个虚线框。
可能很多人不大会注意,当点击一个链接时会出现一个虚线框,其实也没什么影响,可以忽略,但有时候有人会提出想把这个虚线框隐藏掉,该用什么方法做?
以下是解决方案: 方法一: 在IE下是使用html属性:hideFoucs,在HTML标签中加上hidefocus=”true” 属性即可,但这个属性是IE私有的,Firefox是不认的。 欢迎来到
介绍: 方法二: 在页面中加入下面CSS代码即可
如何取消图片超链接时产生的虚框呢?由于产生的虚线框影响页面美观所以想把它去掉,本文提供两种去掉方法,感兴趣的朋友可以参考下哈
html消除点击超链接后产生的线框 for IE for Firefox for IE8
去掉图片链接点击后,图片周围的虚线.html 取得控件的绝对位置.html 取消选取、防止复制.html 可以在收藏夹中显示出你的图标 .html 各种样式的光标.html 回车键换行.html 在打开的子窗口刷新父窗口的代码里...
但版主以上可以看见的修改方法 增加登录次数和上次登录时间 去掉鼠标滚轮缩放图片 论坛输入框外面加上美化虚线 分论坛帖子列表页面底部转换页面的数字的美化方法 帖子中增加随意调整字号...
PrinterMessageBox 在拥有指定打印作业的系统上显示一个打印机出错消息框 PrinterProperties 启动打印机属性对话框,以便对打印机进行配置 ReadPrinter 从打印机读入数据 ResetDC 重设一个设备场景 ResetPrinter...