第4章 超级链接的建立.pptVIP

第4章 创建各种超级链接 本章主要内容 教学目的： 熟悉超级链接的几种类型； 掌握各种超级链接的创建方法； 了解更改超级链接颜色状态的三种方法。 教学重点：相对路径的表示方法、锚点链接的创建、链接颜色的更改 教学难点：相对路径的表示访问、CSS创建链接样式 一、超级链接的概念 所谓超级链接，是页面与页面之间一个单向的关联关系。通过超级链接，可以把Internet上分散的众多网站和网页联系起来。 二、超级链接的类型 １、内部超级链接（相对路径） ２、外部超级链接（绝对路径） ３、空链接 ４、电子邮件链接 ５、锚点链接 ６、图像热区链接 ７、其它链接形式 三、各种超级链接的创建方法 1、内部超级链接的创建（相对路径） 创建内部超级链接，就是在同一个站点内在不同页面之间建立一定的相互关系，又称之为相对路径。 　例如：/bobo/index.asp、../index.asp、 　 ./index.asp 3）从 booklist1.htm到 index.htm （在父文件夹中，booklist1.htm 向上一级）， 　相对路径：../index.htm。 　每个 ../ 表示在文件夹层次结构中上移一级。 ４）从 booklist1.htm到 picture1.htm （在父文件夹的其它子文件夹中），可使用相对路径../mypictures/picture1.htm。其中 ../ 向上移至父文件夹； mypictures/ 向下移至 mypictures子文件夹中。 ５）站点根目录相对路径 　　站点根目录相对路径提供从站点的根文件夹到文档的路径。 　　　站点根目录相对路径以一个正斜杠(/)开始，该正斜杠表示站点根文件夹。 　 　　　例如， /mybooks/ booklist1.htm 是文件 (booklist1.htm) 的站点根目录相对路径 ２、外部超级链接（绝对路径） 外部链接指链接到互联网上其它站点资源的链接，又称为绝对路径。 例如：“友情链接”栏目，设置的均为绝对路径。 注意点：完整的ＵＲＬ，如下哪个正确： a href=搜狐网/a a href=sohu/a ３、创建空链接 空链接是一个没有指向对象的链接。利用空链接通常是为了激活网页中的文本或图像等对象，以便给他加行为， ４、创建电子邮件链接 电子邮件链接是提供浏览者快速发送邮件给站长的链接通道，并且直接打开电子邮件处理软件进行发送。 例如：单击网页链接　 　　“与我联系” 创建方法： 1）插入／电子邮件链接，设置如下对话框 　 ２）a href=mailto:webmaster@8517.com 与我联系/a ５、创建锚点链接 锚点常用于包含大量文本信息的网页，通过在这样的网页上设置锚点，再通过锚点链接，就可以直接浏览相应的网页内容，从而大大加快了浏览速度。 实例演示 6、图像热区链接 制作、编辑、删除热区 四、链接的修饰与属性 1、设置（单个）链接颜色 链接颜色状态： 未访问过链接的文本颜色（Link)：默认“蓝色” 已访问过链接的文本颜色(visited)：默认“红色” 正在访问的链接颜色状态(Hover)：默认“蓝色” 修改链接颜色状态的三种方法： 方法一：利用网页属性对话框设置（修改/页面属性） 修改链接颜色状态的三种方法： 方法二：使用Dreamweaver的默认配色方案 （命令/设定配色方案） 提出问题: 如何在网页中设置二种不同效果的链接样式? 修改链接颜色状态的三种方法： 方法三：使用CSS （层叠样式表）进行设定 （推荐使用） 1）新建样式，设定未访问过链接颜色状态（a.link) 1）设定活动链接颜色状态（a.hover) 2、设置（多个）链接颜色,并应用样式 a:Link 改成 a.linkname2:link a:visited 改成 a.linkname2:visited a:hover 改成 a.linkname2:hover 3、在新的浏览器窗口中打开链接文件 a href= target=_blank链接文字/a 4、设置链接替换文字 适合对象：图像链接、热区链接 本章小结 本章详细介绍了网页中链接的应用各种链接的创建方法及修饰方法。 1、超级链接的类型 2、超级链接的修饰及属性 课后练习 使用Dreamweaver创建各类超级链接 * * 1）从 booklist1.htm 到booklist2.htm 　　相对路径：booklist2.htm