前端开发技术HTMLCSSJavaScript_教学课件_聂常红 第4讲 超链接多媒体及表格标记.pptVIP

第4讲 超链接、多媒体及表格 4.1 超链接标记 4.2 多媒体标记 4.3 表格标记 学习目标 掌握各种超链接的设置 掌握各种常用多媒体标记的使用 掌握创建表格以及格式化表格 掌握使用嵌套表格布局网页 4.1 超链接标记 浏览者通过单击文本或图片对象，可以从一个页面跳到另一个页面，或从页面的一个位置跳到另一个位置，实现这样的功能的对象称之为超链接 创建超链接的条件：必须同时存在两个端点。一个是源端点；另一个是目标端点 源端点：指网页中的提供链接单击的对象， 如链接文本或链接图像 目标端点：指链接跳过去的页面或位置， 如某网页、书签等 1）超链接标记及常用属性 2）链接路径设置 绝对路径: 指文件的完整路径 文件相对路径：指相对于当前文件的路径 文件相对路径有以下几种： 3）超链接类型 根据超链接的目标端点来分，超链接可分为： 内部链接 外部链接 书签链接 脚本链接 文件下载链接 根据超链接的源端点来分，超链接可分为： 文本链接 图像链接 图像映射 内部链接 内部链接是指在同一个网站内部，不同网页之间的链接关系 基本语法 a href=“file_name”链接文字/图片/a 语法解释 通过“href”属性指定目标端点； “file_name”为要链接文件的路径，一般使用相对路径；提供给鼠标单击的内容，即源端点，既可以使用“文字”，也可以使用“图片” 外部链接 外部链接是指跳转到当前网站外部，和其他网站中的页面或其他元素之间的链接关系。 基本语法 a href=“URL”链接文字/图片/a 语法解释 通过“href”属性指定目标端点； “URL”为要链接文件的路径，一般情况下，该路径需要使用绝对路径；提供给鼠标单击的内容，即源端点，既可以使用“文字”，也可以使用“图片” a href=“mailto:邮址1？Subject=contentcc=邮址2 bcc=邮址3”链接文字/a 书签链接 书签链接：指目标端点为网页中的某个设置了称为书签标记的位置的链接 创建书签链接步骤： 创建书签 为书签制作链接 ①建立书签 基本语法 a name=“书签名”[文字/图片]/a 语法解释 [文字/图片]中的“[]”表示文字或图片可有可无，书签将在光标处建立一个名为“name”属性值所规定的书签。 ②建立书签链接 基本语法 链接到同一页面中的书签： a href=“#书签名”链接文字/a 链接到其他页面中的书签: a href=“file_name#书签名”链接文字/a 语法解释 “书签名”是已定义的书签名，“file_name”是要跳转到的页面路径。 书签链接示例 脚本链接 在链接语句中，可以通过脚本来实现HTML语言完成不了的功能。 基本语法 a href=“javascript:…”链接内容/a 语法解释 在javascript:后面编写的就是具体的脚本 文件下载链接 要创建文件下载，只要在链接地址处输入文件路径即可，当用户单击链接后，浏览器会自动判断文件类型，以做出不同情况的处理，如直接打开，或弹出下载对话框供下载 可用于下载的文件类型有.doc、.Rar、.cab、.zip、.exe等 基本语法 a href=“File_URL”链接文字/a 文件下载示例 文本链接 文本链接是指源端点为文本文字的超链接 基本语法 a href=“file_name”链接文字/a 图像链接 图像链接是指源端点为图像文件的超链接 基本语法 a href=“filename_link”img src=“filename_img” …/a 语法解释 “filename_link”为要跳转到的文件路径，“filename_img”为图像文件路径，默认情况下，图像链接会显示蓝色边框线，如果不想显示边框，应设置border=0 图像链接示例 图像映射 图像热区：一幅图像被切分成不同的区域，每一个区域可以链接到不同的地址，这些区域称为图像的热区。 图像映射：指源端点为图像热区的超链接 基本语法 img src=“filename_img” usemap=#map_name map name=map_name area shape=“rect” coords=“x1,y1,x2,y2” href=“…” area shape=“circle” coords=“x,y,r” href=“…” area shape=“poly” coords=“x1,y1,x2,y2,x3,y3,x4,y4,x5,y5,…” href=“…” /map 语法解释 img标记中的usename属性主要用于激活映射之用；map标记用