当前位置:首页 > Div + CSS

如何去除点击链接时出现的虚线框

canca18年前 (2008-06-06)Div + CSS765

有时候在一个页面用到收放功能的时候时,总有一个虚线框在触发收放的功能按钮上,显得特别刺眼,那如何去除这个虚线框呢?

虽然从可用性的角度,隐藏虚线框的做法会让键盘偏执狂不满。但从视觉上,有时候虚线框确实影响美观。

方法一:

IE 下可使用其私有的html属性:hideFoucs,在标签的结构中加入 hidefocus=”true” 属性。即:

<a href="http://www.taobao.com" hidefocus="true" title="淘宝网,淘我喜欢">淘宝网</a>

而在 Firfox 浏览器中则相对比较容易,直接给标签 a 定义样式 outline:none; 就可以了,即:

.HideFocus { outline:none; }

方法二:

也可以仅用 CSS 来控制,即对 IE 的情形使用 expression 表达式,但不推荐使用,毕竟 expression 在性能上有问题。

.HideFocus { hide-focus: expression(this.hideFocus=true); /* for ie 5+ */ outline: none; /* for firefox 1.5 + */ }

opera9 似乎默认就不显示焦点虚线框。

除链接外,该 CSS 同样适用于 input 和 button 标签。

IE6, IE7, FF1.5, FF2, Opera9 测试通过。

扫描二维码推送至手机访问。

版权声明:本文由Ant.Master's Blog发布,如需转载请注明出处。

本文链接:https://iant.work/post/412.html

标签: Div + CSS
分享给朋友:

“如何去除点击链接时出现的虚线框” 的相关文章

CSS DIV超出范围加(...)

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>www.aspxuexi.com asp学习网</title&…

CSS hack浏览器兼容一览表

CSS hack是指我们为了兼容各浏览器,而使用的特别的css定义技巧。这是国外摘来的一张CSS hack列表,显示了各浏览器对css hack的支持程度,对我们制作兼容网页非常有帮助。  …

Opera hack

@media all and (min-width:0px){  选择符 {样式内容}}…

div+css布局时的浏览器兼容问题

随着火狐浏览器的市场占有率的提高,而IE则有所下降,特别是在欧洲那边,火狐浏览器的市场占有率更高,在没有一个统一的标准下,浏览器的兼容问题变得越来越重要.有时候在IE下看是好好的,在火狐或其他浏览器却面目全非了,那时...…

图片垂直居中的使用技巧

“使用纯CSS实现未知尺寸的图片(但高宽都小于200px)在200px的正方形容器中水平和垂直居中。” 当然出题并不是随意,而是有其现实的原因,垂直居中是 淘宝 工作中最常遇到的一个问题,很有代表性。 题目的难点在于两点: 垂...…

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。