DW如何批量消除网页连接上的“虚线框”

2016-02-19 21:29 24 1 收藏

图老师小编精心整理的DW如何批量消除网页连接上的“虚线框”希望大家喜欢,觉得好的亲们记得收藏起来哦!您的支持就是小编更新的动力~

【 tulaoshi.com - Web开发 】

  各位想必都知道,onfocus=”this.blur()”这条代码能消除链接时的虚线框,但你有没有想过,如果你的网页上有几个甚至上百个链接,而你又想要去掉上面那些讨厌的虚线框,难道你还一个个去Ctrl+C、Ctrl+V,天哪!这对一个正常人来说绝对是个恶梦。也许你会说,用DW或其它文本编辑器里的“查找/替换”功能就能解决,对!不可否认,这是一个好办法,但作为一个优秀的web developer,用尽可能少的代码实现一样的功能才是我们应当追求的目标,下面我们就用htc来解决这问题。至于htc是什么,全称就是HTML Components,由微软在IE5.0后开始提供的一种新的指令组合,它可以把某种特定功能的代码封装在一个组件之中,从而实现了代码的重复使用。作为一个组件,htc里包含了属性、方法、事件等等各种知识,在这里就不一一介绍了,具体内容各位可以参考微软的msdn主页。

  回到开始处,Onfocus=this.blur()在这里很显然,onfocus是一个事件,this.blur()则是被事件所触发的对象,既然这点明确了,代码就知道该怎么写了。

public:attach event=”onfocus” onevent=”example()” /

script language=”javascript”

function example(){

this.blur();

}

/script

将以上代码存为.htc为扩展名的文件,然后再编写一个普通的HTML网页

HTML

head

style

a {behavior:url(htc文件所在路径地址)}

/style

body

a href=../../”#”链接1/a

a href=../../”#”链接2/a

a href=../../”#”链接3/a

点链接试试,没有虚线框了吧

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

/body

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

/HTML
 

  OK,保存,预览,怎么样?效果出来了吧,再看看代码,的确精简了不少,而且在链接越多时体现得越发明显。最后我要说的是,这还仅仅是htc应用上的冰山一角而已,更多的功能还需要你们去认识,相信有点JS与CSS基础的你一定能学有所成。

来源:http://www.tulaoshi.com/n/20160219/1626274.html

延伸阅读
标签: Web开发
做网站,麻烦在更新,特别是大规模更新,工作量非常大。真不知那些创意不断而又勤奋的“站长”,隔三岔五将网站来个“大换血”,是怎么忙过来的。 告诉你这个秘密吧,他们很多是在“批发”网页,并且你的机器中也有这样的“批发站”呢!这个好东东就是——模板。常见的网页制作工具:FrontPage、DreamWeaver中都有这项功能。如用DreamW...
Win7系统桌面图标虚线框的取消技巧   桌面图标有虚线框,怎么去除呢?下文将介绍Win7系统桌面图标虚线框的取消技巧 1:在开始菜单或者桌面上右击计算机,打开属性,或者在控制面板中打开系统,然后在左侧打开高级系统设置功能,在高级中打开性能的设置,勾选在桌面上为图标标签使用阴影,确定,退出。 完成设置此项,重...
标签: Web开发
    文字链接是网页中最常见的页面元素,在默认状态下,文字链接样式都是带下划线的,这种一陈不变的外观使网页无法凸现个性和满足布局的需要。为了使文字链接符合页面的整体效果,可以采用 CSS (样式)来实现多样的文字链接。     效果说明     将鼠标置于文本上时,文本样式会发生改变,比...
怎么去除win7系统桌面图标虚线框   1、首先鼠标右击电脑桌面上的计算机图标选择属性,在打开的界面中点击左侧的高级系统设置项; 2、然后在打开的系统属性界面中,切换到高级选项卡下,点击性能框下的设置按钮; 3、接着在打开的性能选项窗口中,选择自定义,然后在下方找到并将在桌面上为图标标签使用阴影的勾取消掉,...
标签: Web开发
链接用图片做背景,text-indent:-9999px; 隐藏文字,此效果在 IE 中是正常的,但在 Firefox 里,鼠标点击该链接时,虚线框却会包住被缩进的文字,结果显示为虚线框 N 长。 因为平时是用overflow:hidden; 属性的,所以一直也没有注意到这个问题的存在,但当你需要使用 JS 来实现某种交互时,强烈建议不要使用 overflow:hidden; 属性...

经验教程

909

收藏

25
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部