教学项目十一 HTML中超级链接标志的使用 【教学内容】 讲解HTML中超级链接标志 【教学目的】 使学生掌握超级链接标志的使用 【教学重点】 超级链接标志的使用 【教学难点】 理解书签超级链接的意义 target属性不同取值对应的含义 【教学方式】 案例分析式、练习式相结合 【教学参考】 1．<<JavaScript 入门与提高>> 杨浩著 清华大学出版社 2．<<Internet 网页工场>> Wittime工作室 重庆出版社 3．<<JavaScript从入门到精通>> 电脑报社出版 【新课】 超级链接的实现 格式： <a href=URL>文本|图片</a> 链接到网址 例：设定到网址的超级链接 <html> <head> <title>超级链接例一</title> </head> <body bgcolor=yellow> <br><br> <center><font face=隶书 color=red size=5>友情链接</font></center> <p align=center><br> <a href=http://www.sina.com.cn>新浪网</a> <a href=http://www.cctv.com>央视国际</a> <a href=http://www.163.net>163电子邮局</a> </body> </html>  思考： 怎样实现点击图片与文字均可链接到湖北职院网站？  <HTML> <Head> <title>我的个人网页</title> </head> <body bgcolor=#00ffee> <center> <a href=http://www.hbvtc.cn><img src=03.jpg width="357" height="189"> <br><font size=6>湖北职业技术学院</font></a></center> </body> </html> 链接到电子邮件地址 格式： <a href=mailto:email>图片|文字</a> 例：  <HTML> <Head> <title>我的个人网页</title> </head> <body bgcolor=pink> <center><a href=mailto:xgzyljj@163.net>联系我们</a> </body> </html> 3．链接到指定的文件  <HTML> <Head> <title>我的个人网页</title> </head> <body bgcolor=eeff00> <center><font size=6 face=楷体>畅销书推荐</font></center> <ol > <font size=4> <li><a href=1.doc>谁动了我的奶酪</a> <li><a href=2.doc>心灵鸡汤</A> <li><A href=3.doc>至高利益</a> </font> </ol> </body> </html> 说明：在使用<a></a>标志时，可以配合使用属性target: target=_self 超级链接网页显示在当前框架 target=_blank 超级链接网页显示在一个新窗口 target=_top 超级链接网页显示在整个窗口 target=_parent 超级链接网页显示在上一层的框架 4．链接到书签 (1) 定义书签 <a name=书签名>链接点</a> (2) 设定书签链接 <a href=#书签名>文本|图片</a> 例：设定有三个书签的链接     <HTML> <Head> <title>书签使用</title> </head> <body bgcolor=pink> <p><br><center>微笑</p> <a href=#mark1>第一节</a> <a href=#mark2>第二节</a> <a href=#mark3>第三节</a> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> <br><br><br><br> </center> 　　<p><a name=#mark1>第一节</a><br>林是在篮球场上认识他的。当时他并不知 道他的名字。只是好像有一次， <br>林正在一旁独玩球，然后他走过来，微笑着说："一起玩吧，正好 我们少一个 <br>人。”其实林是一个很内向的人，不喜欢和不认识的人一起玩 球，但他的微 <br>笑给林留下了深刻的印象，所以就欣然答应了。 　　<br>以后，林发现他每天早晨都很早来到这里，他打球不错，对人也很热情， <br>见到人总会上前问声好。最重要的是他脸上总会带着微笑。林很奇怪为什么 <br>他看起来总是无忧无虑，没有任何烦恼。</p> 　　<br><br><BR><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> <p><a name=#mark2>第二节</a><br>再后来,林知道了他叫强。 　　<br><p>以后的交往中，林发现强很有意思，他绝对是那种无忧无虑的人，他很会 <br>说笑话，如果不小心踩了他的脚，他也会笑嘻嘻地说：“哎呀，对不起，耽误 <br>你的脚落地了。"他喜欢说"事情还不算很坏""还有机会"一 类的话。看起来似 <br>乎已经没有希望的事情，他仍会兴致勃勃地去做，虽然大多数时候不会改变事 <br>情状况，他也会微笑着面对失败。</p> 　　<br><p>考试完了，林没有考好，心情很苦闷，“真惨呀。”他独自站在操场上， <br>看着欢乐的人群发呆。这时强走了过来，唱着一首很奇怪的、好橡是自己编出 <br>来的歌，一副 很悠闲自在的样子，他走到林的面前停了下来，做了一个鬼脸， <br>林看着他 滑稽的样子，忍不住笑了起来。“对，就是这个样子，笑一笑，别 <br>想那些烦心的事了，事情还不是很糟，不是吗？"他微笑着说。</p> 　<br>慢慢的，林的脸上也开始有了微笑。 <br><br><br><br><br> 　　<p><a name=#mark3>第三节</a><br>一天，强没有来到篮球场。“大概是他有事吧？”林这样想着。第二天， <br>第三天，他仍然没来。一直到第四天他才来。但脸色变得很 苍白，精神似乎 <br>也不如从前了。只有那副微笑挂在他的脸上，丝毫未变。 <br><p>　过了一些天，林又没有来到篮球场，而且一直没来，“他怎么没来呢？ <br>林开始担心起来。后来他打听到林的住处。那是一座环境很幽静 的房子。他 <br>敲了敲门，但很久都没人开门。这时，一位老奶奶走了过来。 <br>“别敲了，他家没人，都在医院呢。” <br>“医院？” <br>“是啊，这家孩子得了白血病，已经没几天了。哎，真可怜。” <br>老奶奶带着一声叹息走远了。林呆呆地站在那里，“怎么会呢？他 怎么 <br>会得白血病呢？看他的样子不像是有病的人呀，他得了这样的病怎么 还会整 <br>天无忧无虑的呢？" <br><p>　　带着疑惑和同情。林来到医院看望强。来到病房前，他惊讶地看见， 强 <br>正坐在病床上悠闲地翻一本杂志，只是人消瘦了许多。看到林，他仍然 是微 <br>微一笑，然后举起那本杂志，顽皮地说：“看，乔丹又要复出了。他 从不会 <br>对他的年龄服输的。他还有机会，只要不服输，只要不放弃希望， 一切都会 <br>好起来的......" </p> <br><p>　林听着，突然他全明白了。是的，只要不服输，只要不放弃希望，一切都 <br>会好起来的。强就是这样生活着的，他从来没有服输，也从来没有放 弃过希 <br>望，所以他能快乐地活着。</p> <br><p>　　以后，强再也没有来过篮球场。</p> </body> </html> 【课后小结】 本节介绍了HTML中超级链接标志的使用，书签链接是一类特殊的链接方式，理解和使用书签链接学习HTML中超级链接标志的难点。