第5讲 超链接及多媒体

1、1 回顾内容: 文字标记文字标记 段落标记段落标记 列表标记列表标记 图片标记图片标记 2 第第5讲讲 超链接标记与多媒体标记超链接标记与多媒体标记 5.1 超链接标记超链接标记 5.2 框架标记框架标记 5.3 多媒体标记多媒体标记 3 学习目标学习目标 掌握各种超链接的设置掌握各种超链接的设置 文本超链接文本超链接 图像超链接图像超链接 框架超链接框架超链接 掌握各种常用多媒体标记的使用掌握各种常用多媒体标记的使用 4 5.1 超链接标记超链接标记 浏览者通过单击浏览者通过单击文本文本或或图片图片对象，可以从一个对象，可以从一个 页面跳到另一个页面，或从页面的一个位置跳页面跳到另一个页面，

2、或从页面的一个位置跳 到另一个位置，实现这样的功能的对象称之为到另一个位置，实现这样的功能的对象称之为 超链接超链接 创建超链接的条件：必须创建超链接的条件：必须同时同时存在两个端点。存在两个端点。 一个是源端点；另一个是目标端点一个是源端点；另一个是目标端点 源端点：源端点：指网页中的提供链接单击的指网页中的提供链接单击的对象对象， 如链接文本或链接图像如链接文本或链接图像 目标端点：目标端点：指链接跳过去的指链接跳过去的页面页面或或位置位置， 如某网页、书签等如某网页、书签等 1 1）超链接标记及常用属性 属属 性性 描描 述述 href指定链接路径（必设属性）指定链接路径（必设属性） n

3、ame定义书签名称定义书签名称 target指定打开链接目标文件的窗口指定打开链接目标文件的窗口 title设置链接提示文字设置链接提示文字 target属性属性 值值 描描 述述 _blank在新窗口中打开链接文档在新窗口中打开链接文档 _self在同一个帧或窗口中打开链接在同一个帧或窗口中打开链接 文档（默认属性）文档（默认属性） _parent在上一级窗口中打开，一般在在上一级窗口中打开，一般在 框架页中经常使用框架页中经常使用 _top在浏览器的整个窗口中打开，在浏览器的整个窗口中打开， 忽略任何框架忽略任何框架 框架窗口名框架窗口名在指定的框架窗口中打开链接在指定的框架窗口中打开链接

4、 文档文档 6 7 2）超链接类型超链接类型 根据超链接的源端点来分，超链接根据超链接的源端点来分，超链接 可分为：可分为： 文本链接文本链接 图像链接图像链接 图像映射图像映射 8 文本链接文本链接 文本链接是指源端点为文本链接是指源端点为文本文字文本文字的的 超链接超链接 基本语法基本语法 链接文字链接文字 9 内部链接内部链接 内部链接是指在内部链接是指在同一个网站同一个网站内部，不内部，不 同网页之间的链接关系同网页之间的链接关系 10 外部链接外部链接 外部链接是指跳转到外部链接是指跳转到当前网站外部当前网站外部，和其他，和其他 网站中的页面或其他元素之间的链接关系。网站中的页面或其

5、他元素之间的链接关系。 服务服务URL格式格式描述描述 WWWhttp:/ 进入万维网站进入万维网站 E-Mailmailto: 启动邮件发送启动邮件发送 系统系统 ftpftp:/ 进入文件传输进入文件传输 服务器服务器 a 链 接文字 表表5-1 邮件参数邮件参数 启动邮件发送系统设置语法启动邮件发送系统设置语法 12 13 页面内部链接页面内部链接(书签标记书签标记) 指目标端点为网页中的某个设置了指目标端点为网页中的某个设置了 称为称为书签标记书签标记的的位置位置的链接的链接 创建书签链接步骤：创建书签链接步骤： 创建书签创建书签 为书签制作链接为书签制作链接 14 建立书签建立书签

6、基本语法基本语法 文字文字/图图 片片 语法解释语法解释 文字文字/图片图片中的中的“ ”表示文字或表示文字或 图片可有可无，书签将在光标处建立图片可有可无，书签将在光标处建立 一个名为一个名为“name”属性值所规定的书属性值所规定的书 签。签。 15 建立书签链接建立书签链接 基本语法基本语法 链接到同一页面中的书签：链接到同一页面中的书签： 链接文字链接文字 链接到其他页面中的书签链接到其他页面中的书签: 链接文链接文 字字 语法解释语法解释 “书签名书签名”是已定义的书签名，是已定义的书签名， “file_name”是要跳转到的页面路径。是要跳转到的页面路径。 书签链接示例书签链接示例

7、 16 文件下载链接文件下载链接 要创建文件下载，只要在链接地址要创建文件下载，只要在链接地址 处输入文件路径即可，当用户单击处输入文件路径即可，当用户单击 链接后，浏览器会自动判断文件类链接后，浏览器会自动判断文件类 型，以做出不同情况的处理，如直型，以做出不同情况的处理，如直 接打开，或弹出下载对话框供下载接打开，或弹出下载对话框供下载 17 基本语法基本语法 链接文字链接文字 文件下载示例文件下载示例 take me to your heart.mp3 clock.avi 18 图像链接图像链接 图像链接是指源端点为图像链接是指源端点为图像文件图像文件的超链接的超链接 基本语法基本语法

8、注：默认情况下，图像链接会显示蓝色边框线，注：默认情况下，图像链接会显示蓝色边框线， 如果不想显示边框，应设置图像的如果不想显示边框，应设置图像的border=0 19 图像链接示例图像链接示例 20 框架的作用，就是把浏览器窗口划分成框架的作用，就是把浏览器窗口划分成 若干个区域，每个区域可以分别显示不若干个区域，每个区域可以分别显示不 同的网页。同的网页。 注意：注意：使用框架结构时，使用框架结构时，HTML文档中文档中 不能出现不能出现标记对，此时标记对，此时 需要由需要由代替代替 5.2 框架结构框架结构 21 框架集标记框架集标记：主要是主要是 定义浏览器窗口的分割方式、各分定义浏览

9、器窗口的分割方式、各分 割窗口（框架）的大小以及格式化割窗口（框架）的大小以及格式化 框架边框框架边框 框架标记框架标记：定义各分割窗定义各分割窗 口中显示的内容，并能对各分割窗口中显示的内容，并能对各分割窗 口进行格式化口进行格式化 1） 框架结构组成标记框架结构组成标记 22 2）框架集标记）框架集标记 表表6-1 常用常用属性属性 框架分割窗口方式 用用colscols将窗口左右（水平）分割将窗口左右（水平）分割 frameset ” 用用rowsrows将窗口上下（垂直）分割将窗口上下（垂直）分割 frameset cols=“n1,n2, 嵌套分割：浏览器窗口既存在左右嵌套分割：浏览

10、器窗口既存在左右 分割，又存在上下分割分割，又存在上下分割 24 25 26 3) 3) 框架标记 基本语法基本语法 frameset cols= frame frame . . 语法解释语法解释 srcsrc属性用于设置在框架窗口中显示的内容来自属性用于设置在框架窗口中显示的内容来自 的文件；的文件；namename属性用于标记框架名称，以便于其属性用于标记框架名称，以便于其 他对象对它的引用，如作为链接的一个目标窗口他对象对它的引用，如作为链接的一个目标窗口 28 普通框架与链接示例普通框架与链接示例 leftright 5) 5) 浮动框架 浮动框架是一种特殊的框架页面，其作为浮动框架是

11、一种特殊的框架页面，其作为HTMLHTML 文档文档的的一部分一部分，就象图像一样出现在，就象图像一样出现在HTMLHTML文档文档 中。浮动框架允许将一个中。浮动框架允许将一个HTMLHTML文档插入到另一文档插入到另一 个个HTMLHTML文档内部的文档内部的某个区域某个区域。 基本语法基本语法 30 5.3 5.3 多媒体标记 为增强网页的功能以及动感，现在的网页一般都为增强网页的功能以及动感，现在的网页一般都 会加入诸如声音、动画、视频等多媒体内容。会加入诸如声音、动画、视频等多媒体内容。 示例示例 常用多媒体标记：常用多媒体标记： 1) 1) 滚动文字设置 基本语法基本语法 滚动文字

12、滚动文字 marqueemarquee常用属性常用属性: : 33 2) 2) 嵌入多媒体内容 在网页中可以使用在网页中可以使用标记嵌入标记嵌入MP3MP3、 电影等多媒体内容电影等多媒体内容 基本语法基本语法 embed embedembed标记常用属性：标记常用属性： 3) 3) 设置背景音乐 访问者访问页面时自动播放背景音乐访问者访问页面时自动播放背景音乐 基本语法基本语法 bgsoundbgsound标记常用属性：标记常用属性： 36 37 小小 结结 创建超链接必须具备的条件是同时存在源端创建超链接必须具备的条件是同时存在源端 点和目标端点点和目标端点 在创始超链接时经常涉及的路径有

13、两种：绝在创始超链接时经常涉及的路径有两种：绝 对路径、文件相对路径对路径、文件相对路径 通常外部链接需要使用绝对路径，内部链接通常外部链接需要使用绝对路径，内部链接 一般使用文件相对路径一般使用文件相对路径 超链接必设的一个属性是超链接必设的一个属性是href 通过通过target属性，可使用目标端点在不同的属性，可使用目标端点在不同的 窗口打开窗口打开 38 根据源端点，超链接可分为文本超链接、图像超根据源端点，超链接可分为文本超链接、图像超 链接和图像映射；根据目标端点，超链接则可分链接和图像映射；根据目标端点，超链接则可分 为内部链接、外部链接、书签链接和文件下载链为内部链接、外部链接、书签链接和文件下载链 接接 创建书签链接的步骤有两步：一是创建书签；二创建书签链接的步骤有两步：一是创建书签；二 是为书签制作链接是为书签制作链接 39 思考题思考题 1. 创始超链接必须具备的条件是什么？创始超链接必须具备的条件是什么？ 2. 外部和内部链接一般各需要使用什么路径