第5章创建网页超链接(1)
《网页设计》教学大纲
课程名称：网页设计课程代码：总学分：4总学时：54适用专业：计算机专业的本科先修课程和后续课程先修课程：计算机基础、图像类设计软件、计算机类语言后续课程：一、课程的性质、目的与任务课程性质：本课程是计算机网络技术、软件技术、电子信息技术、计算机系统与维护、电子商务技术等专业的技术基础课，属于必修课范畴。
课程目的：通过本课程学习，使学生了解网页制作的基础知识、基本流程。
熟悉并掌握HTML语言，WEB服务器的配置，CSS，JA V ASCRIPT并能熟练使用Dreamweaver网站的设计、制作与维护更新，为动态网页设计打下基础。
课程任务：本课程结合实例，详细介绍了HTML标记语言、CSS样式表的应用、JA V ASCRIPT程序设计等知识。
通过本课程的学习，使学生能够掌握网页设计与制作的基本技能，并轻松地创建出具个性化的静态网站等。
二、教学的基本要求以理论够用为度注重技能的培养。
在掌握主要概念和基本操作后，进行专项和综合训练。
通过课堂学习、课后练习和上机实验，使基本技能的训练得到加强，培养学生实际操作的能力。
（一）理论知识方面主要达到：1．掌握网页设计相关常识，熟悉网页制作的基本技术；2．了解网站设计制作的常用工具与基本流程，了解不同网站类型不同的设计与制作要求，了解网站的整体结构规划；3．掌握HTML语言；4．掌握利用CSS构建网站；5. 掌握利用表格或者CSS 进行网页布局5．理解脚本语言以及掌握JA V ASCRIPT（二）能力方面主要达到：1．熟练掌握使用手工编写HTML代码的方式编写网页；2．熟练掌握利用CSS+DIV方式进行网页设计；3．熟练掌握Macromedia Dremweave的基本操作；4．了解网页设计稿文件的切片与优化输出；了解网页图像的优化技巧；5．掌握JA V ASCRIPT编写一些简单的交互程序；6．掌握网站的测试、发布、推广与维护；三、课程教学内容、重点与难点第1章网页与网站基础知识1网页与网站的概念2网页的设计3网页版式和布局4网站的策划与创建原则●教学基础要求使学生对网站及网页有一定的认识，激发学生学习网页设计的兴趣●教学重点网页设计中的若干术语●教学难点网页设计中的若干术语第2章html基础1 html文档结构2 html基本语法●教学基础要求标记对与格式标记的使用●教学重点格式标记的使用●教学难点HTML基本语法第3章文字与段落1文字内容2文字样式3文字修饰4段落●教学基础要求了解标题元素,掌握字体,上下标,及特殊字符的标记●教学重点网页中特殊符号的输入●教学难点特殊符号对应的标记第4章列表1列表简介2无序列表3有序列表4嵌套列表5定义列表6菜单列表和目录列表●教学基础要求使学生对网站及网页有一定的认识，激发学生学习网页设计的兴趣●教学重点定义列表●教学难点菜单列表第5章超链接1超链接简介2创建超链接3链接对象●教学基础要求掌握超级链接标记的使用●教学重点字体、图片和超级链接标记的使用●教学难点理解书签超级链接的意义第6章表格1表格2表格标记3表格属性修饰4设置行的属性5设置单元格的属性6表格嵌套●教学基础要求掌握简单表格的制作表格中单元格的合并以及表格嵌套和叠加操作●教学难点理解表格属性rowspan与colspan的含义以及表格嵌套实现第7章框架1框架简介2框架的设置3子窗口的设置4浮动框架●教学基础要求掌握框架的制作●教学重点框架的嵌套使用●教学难点理解框架属性name、target的意义第8章表单1表单2输入3多行文本输入框4下拉列表框●教学基础要求掌握框架的使用●教学重点表单元素标志与属性●教学难点理解表单中相应元素对应标志及属性的含义第9章使用CSS格式化网页1样式表的定义与使用2定义选择符3文字与排版式的使用4背景与颜色的使用5美化网页与超链接的设置6矩形模块的概念与使用7列表●教学基础要求在网页中掌握CSS的运用方法●教学重点样式的定义CSS准确应用第10章javascript基础1javascript起步2javascript程序3标识符和变量4运算符和表达式5javascript程序控制结构6常用对象7事件编程●教学基础要求掌握JavaScript在网页开发中的程序设计●教学重点JavaScript函数、BOM对象的处理、DOM对象的处理●教学难点BOM对象的处理、DOM对象的处理、CSS2Properties对象的处理第11章web设计基础1web设计原则2网站结构规划3网页布局4内容设计5色彩设计●教学基础要求掌握WEB设计的原则●教学重点网页布局●教学难点网页规划第12章页面布局技术1.表格布局方法2.div+css布局方法3.页面导航布局方法●教学基础要求掌握网页设计中布局方法●教学重点div+css布局●教学难点div+css布局样式的定义与应用四、 课时安排建议（列简表） 序号 内容或章节 讲授学时安排作业 备注1 第1章 网页与网站基础 3 浏览网站，查看源文件2 第2章html 基础3 使用HTML 手工编写网页3 第3章文字与段落 34 第4章列表 35 第5章超链接 36 第6章表格 37 第7章框架 38 第8章表单3 9 第9章css 格式化网页 12 利用CSS 控制网页元素的风格和样式10 第10章javascript 基础 12 编写客户端脚本，与网页元素进行动态交互 11 第11章web 设计基础 3 制作综合网页12第12章 页面布局技术3合计 54五、 选用的教材和课件 教材：《网页设计与开发—html 、css 、javascript 实例教程》 课件：自作六、 考核方式和成绩评定 考核方式：综合设计作品成绩评定：平时成绩：30% ，考试（考核）：70%七、 主要教学参考书(注明：著者、书名、版本、出版者、出版年)执笔人： 审定人： 系（部）主任：。
《网页设计与制作》习题参考答案
《网页设计与制作》习题参考答案第一章网页设计与制作概述1、填空题（1）静态网页、动态网页（2）HyperText Mark-up Language、超文本标记语言或超文本链接标示语言（3）文字、图形图像、动画、视频（4）Microsoft Frontpage（或SharePoint Designer）、Adobe Dreamweaver2、问答题(1)www的特点有哪些？答：1）万维网是无数个网络站点和网页的集合，它们在一起构成了因特网最主要的部分。
2）WWW是建立在客户机／服务器模型之上的。
3）WWW是以超文本标注语言HTML(Hyper Markup Language)与超文本传输协议HTTP(Hyper Text Transfer Protocol)为基础。
4）WWW能够提供面向Internet服务的、一致的用户界面的信息浏览系统。
5）WWW浏览提供界面友好的信息查询接口。
(2)网页的基本元素有哪些？答：组成网页的元素主要有文字、图像、声音、动画、视频、超链接以及交互式处理等。
它们的特点如下：文字：网页中的大多数信息主要以文本方式显示，文字是网页的主体，负责传达信息的功能。
图像：图片给网页添加了色彩，使网页做到了图文并茂，形象生动。
动画：动画是动态的图形，添加动画可以使网页更加生动。
常用的动画格式包括动态GIF图片和Flash动画声音和视频：声音是多媒体网页中的重要组成部分，支持网络的声音文件格式很多，主要有MIDI、WA V、MP3和AIF等。
网页中支持的视频文件格式主要有Realplay、Mpeg、A VI和DivX等。
表格：在网页中使用表格可以控制网页中信息的结构布局。
超链接：超链接是网页与其他网络资源联系的纽带，是网页区别于传统媒体的重要特点导航栏：导航栏的作用是引导浏览者游历所有站点。
表单：表单类似于Windows程序的窗体，用来将浏览者提供的信息，提交给服务器端程序进行处理。
其他常见元素：包括悬停按钮、Java特效和ActiveX等各种特效。
Word插入超链接与交叉引用教程
Word插入超链接与交叉引用教程1. 什么是超链接超链接是指在一个文档中创建指向其他文档、网页、书签、电子邮件地址等的链接。
在Word中，插入超链接可以方便读者跳转至其他相关信息。
插入超链接的步骤如下：(1) 选中要设置超链接的文本。
(2) 在Word菜单栏中选择“插入”选项卡。
(3) 点击“超链接”按钮。
(4) 在弹出的对话框中选择链接的类型，例如“现有文件或网页”、“位置”、“电子邮件地址”等。
(5) 根据所选择的类型填写相应的信息，并点击“确定”按钮。
2. 超链接的使用场景超链接在文档中的使用场景非常广泛，例如：(1) 在文档中插入网页链接，方便读者直接点击查看相关内容。
(2) 在文档中插入其他文档链接，实现文档之间的关联。
(3) 在文档中插入书签链接，方便读者快速定位到指定位置。
3. 如何设置交叉引用交叉引用是指在文档中引用其他位置的内容，例如章节标题、图表编号等。
通过交叉引用，可以实现文档内容的动态更新。
在Word中，设置交叉引用的步骤如下：(1) 确定要引用的位置，例如文本、图表、书签等。
(2) 在要插入交叉引用的位置，选中要引用的内容。
(3) 在Word菜单栏中选择“引用”选项卡。
(4) 点击“交叉引用”按钮。
(5) 在弹出的对话框中选择引用的类型，例如“标题”、“图表”、“书签”等。
(6) 根据所选择的类型选择要引用的具体内容，并点击“插入”按钮。
4. 交叉引用的使用场景交叉引用在文档编写中非常常用，例如：(1) 在文档中引用其他章节的标题，方便读者快速跳转至相关内容。
(2) 在文档中引用图表编号，自动更新图表的序号。
(3) 在文档中引用书签，方便读者直接定位到指定位置。
5. 插入超链接与交叉引用的注意事项在插入超链接与交叉引用时，需要注意以下事项：(1) 填写链接信息时要确保准确性，避免链接失效。
(2) 在插入超链接前，最好先保存目标文件或网页，确保链接目标存在。
(3) 在插入交叉引用时，应注意目标内容的稳定性，避免引用失效。
《网页的超链接》教学设计
《网页的超链接》教学设计教材分析创建超链接这部分内容在《网页制作》这一章中起到了画龙点睛的作用。
在前面几节课的学习中,学员已根据学校网站的素材建立了多个子网页,但这些网页内部的目录和正文、网页之间都是相对独立的,还没有形成有机的整体。
建立超链接能让各个独立的网页形成一个有机的整体,同时将本网站链接到其他的网站,这样可以获取更多的信息。
所以超链接这部分内容,是网页制作中的重点。
教学目标知识与技能: ⒈了解超链接的基本概念;2.掌握同一站点内网页间超链接的制作;⒊掌握与站点外的内容建立超链接的方法;⒋掌握同一页面中超链接的制作方法。
过程与方法: 1.通过设置超链接的操作,学员掌握网页中超链接的制作方法;2.总结操作规律,培养学员自主学习和探究学习的能力。
情感、态度与价值观:1.设置超链接将独立的网页串成一个有机整体,使学员感受成功的喜悦;2.在动手制作的过程中体会作品的内在美,给学员以美的熏陶。
教学重点:超链接、链接载体、链接目标的含义。
教学难点:书签的链接及对应链接位置的设定。
学情分析:学员都能独立的完成单个网页的制作,所以对Frontpage的操作界面已很熟悉;同时在建网站时有过规划,学员对站点内页面的关系有所了解;在powerpoint学习中学员已学习过超链接。
教学过程1.情景导入,激发兴趣1.1 感观体验老师请学员欣赏一个网站,这是以前学员在培训时自制的优秀作品。
学员感受到该网站把多个子网页连接成一个有机整体,形成了一个真正意义上的网站。
1.2 设置疑问学员们思考在刚才浏览网站时各个不同的网页是如何实现跳转的?1.3 引出课题网页的超链接。
“在frontpage中如何设置超链接呢?”接下来我们就一起来学习吧。
设计意图:通过网站来导入,激发学员的兴趣。
同时,引起学员思考自己的网站如何设置超链接。
2.课件展示,学习新知老师自制课件,课件内容是本节课的教学重点,即超链接的基本概念。
设计意图:用课件展示教学重点,可以让学员很好地理解超链接的含义以及分类,为下一步的教学打好基础。
第5章 网页制作软件 Dreamweaver CS5(实验教程)
5.2 Dreamweaver CS5站点管理
5.2.3 站点的发布（Windows 7旗舰版平台 ）
1. 安装Internet信息服务
单击“开始”菜单 “控制面板”命令，在窗体中选择“卸载程 2. Web服务器设置 序”，再单击窗体左侧“打开或关闭Windows功能”。 在弹出的“Windows 功能”对话框中，若“Internet信息服务”复 单击“开始”菜单 |“控制面板”命令，在窗体中选择“系统和安 3. IE浏览 选框已勾选，说明本机已安装该组件，否则选中此复选框，单击 全”，再单击窗体右侧“管理工具”，然后启动“ Internet信息服务 启动本机（ Web服务器）IE浏览器，在地址栏输入本机IP地址或 “确定”按钮，等待安装完成。 (IIS) 管理器”应用程序 localhost，进入网站的首页“index.html”
微视频5-2 演示
5.3 网页制作基本操作
5.3.2 网页的文字处理
3. 设置滚动字幕
滚动字幕是用来显示滚动文本的，如网站的最新通知等。字幕 可以水平滚动，也可以上下滚动。 在Dreamweaver CS5中利用<marquee>标签插入字幕 。
选中要做字幕的 文本 ，单击菜单 栏“插入”|“标 签”命令，打开 “标签选择器” 对话框
• 网站与网页的创建与管理
• 网页制作的基本操作
• CSS样式表的创建与使用 • 网页的各种布局方式 • 行为的应用
5.1 Dreamweaver CS5概述
5.1.1 Dreamweaver的发展
Dreamweaver 1.0 Dreamweaver CS3
Dreamweaver 2.0
Dreamweaver 2.01 Dreamweaver 3 Macromedia Dreamweaver 4 时代 Dreamweaver 5 Dreamweaver MX Dreamweaver MX 2004 Dreamweaver 8.0 Adobe 时代
第5章 超链接
5.2.3 外部链接
外部链接指跳转到当前网站外部，与其它 网站中页面或其它元素之间的链接关系。 外部链接的URL地址一般要用绝对路径。
<a href=“http://网址”>
5.2.3 外部链接
表5-2 常用的URL格式
服 务 URL格式
ftp://192.168.0.1 news:// mailto:abc@
5.2.1 设置超链接路径
3.根路径
是指从站点的根文件夹到文档的路径。 站点根目录相对路径以一个正斜杠开始，该正 斜杠表示站点根文件夹。 用于网站的内部链接，不建议使用。
当一个站点放置在几个服务器上或一个服务器 上放置了几个站点时，可以使用根路径。
5.2.1 设置超链接路径
链接本地机器上的文件时，应该使用相对路 径还是绝对路径？ 在绝大多数情况下使用相对路径比较好，例如， 用绝对路径定义了链接，当把文件夹改名或者 移动之后，那么所有的链接都要失败，这样就 必须对你的所有html文件的链接进行重新编排， 而一旦将此文件夹移到网络服务器上时，需要 重新改动的地方就更多了，那是一件很麻烦的 事情。而使用相对路径，不仅在本地机器环境 下适合，就是上传到网络或其他系统下也不需 要进行多少更改就能准确链接。
5.2.1 设置超链接路径
所需要的所有信息。 绝对路径是指链接文件的完整路径，包括完整 的协议名称、主机名称、文件夹名称和文件名 称。
用于网站的外部链接。
如果要链接站点外远程服务器上的网页或图像 等文件，必须使用绝对路径进行链接，即使站 点移动至其他位置也不会出现断链现象。
带下划线的蓝色文本
5.2.1 设置超链接路径
每一个文件都有自己的存放位置和路径， 理解一个文件到要链接的那个文件之间的 路径关系是创建链接的根本。
Web程序设计(第4版)-第5章
5.1 脚本语言JavaScript
5.1.2 JavaScript语言概述
• JavaScript是一种嵌入在HTML文件中的脚本语言，它 是基于对象和事件驱动的，能对诸如鼠标单击、表单输入、 页面浏览等用户事件做出反应并进行处理。 • JavaScript特点：
var str;
/*声明变量str*/
num1=10;
/*说明num1为整型，并将其值赋为10*/
num2=3.02e10;
str1="欢迎您";
《Web程序设计》(第4版)，电子工业出版社，2015，ISBN：9787121260360
5.1 脚本语言JavaScript
5.1.3 JavaScript编程基础
5.1 脚本语言JavaScript
5.1.3 JavaScript编程基础
4．运算符和表达式
• 算术运算符。算术运算符的操作数和结果都是数值型值。算术运算符 及位运算符可与赋值运算符结合形成简记形式
赋值运算符简记形式表
运算符 操 作
+
加法
*
乘法
%
取模
--
递减
运算符 -（双目） / ++ -（单目）
• 传统脚本语言常用来编写执行一次性任务，通常以文本(如 ASCII)保存，只在被调用时进行解释或编译。
• 而现在脚本和传统编程语言之间的界限越来越模糊。在一些 脚本语言中，有经验的程序员可以进行大量优化工作。
• 本章所讨论的脚本语言是指用于Web页面及程序设计的脚本 语言，它们通常是嵌入式（嵌入到HTML文件中）的、具有解 释执行的特征。
Dreamweaver网页设计 课程标准(电商网站方向)
《Dreamweaver网页设计》课程标准适用专业：电子商务专业学分数：7总学时数：108 理论课时：64 实践课时：44一、理论教学部分（一）课程的性质和任务1．课程性质：《Dreamweaver网页设计》本课程是计算机各专业的一门实践性很强的技术基础课，是一门必修的专业课。
主要学习如何利用Dreamweaver这个软件进行网页的设计与制作。
2．课程任务：本课程的主要任务是介绍利用Dreamweaver开发工具进行网页设计，包括新建、编辑和设置一个Web站点；如何对页面属性进行基本的设置，如何设置、编辑CSS层叠式样式表；如何排版文字、表格和层；如何进行基本的图像处理；建立框架；模板和库的使用和编辑；网站的发布与维护等基本知识与应用。
目的是通过本课程的学习，培养学生的实际动手能力和计算机的操作能力，能够运用所学的知识进行网页设计。
（二）教学内容和教学要求第一章 Dreamweaver基础（2学时）【教学内容】一、Dreamweaver 的历史和简介；二、Dreamweaver 8.0的安装过程；三、Dreamweaver 8.0 的全新界面；四、改进的设计与开发环境；五、主菜单介绍；六、对象控制面板介绍。
【教学目的与教学要求】掌握Dreamweaver的基本特点、新增功能及界面组成。
基本操作，如安装、新建、打开、导入、保存、关闭等；理解新增功能、界面组成的优点；了解Dreamweaver可以为我们做些什么。
第二章网页设计语言基础（7学时）【教学内容】一、HTML及XHTML语言介绍；二、常用的网页语法标记。
【教学目的与教学要求】理解HTML及XHTML语言介绍，常用的网页语法标记。
第三章文本和图像处理（4学时）【教学内容】一、文本属性面板介绍；二、编辑文本和插入对象；三；设置文本的格式；四、编号与项目符号；五、在网页中插入图像；六、图像的应用。
【教学目的与教学要求】掌握设置文本属性和格式，编号与项目符号的使用，插入、编辑和排版图像；理解如何进行图像调整。
Web习题参考答案
《网页设计与制作》习题参考答案第一章网页设计与制作概述1、填空题（1）静态网页、动态网页（2）HyperText Mark-up Language、超文本标记语言或超文本链接标示语言（3）文字、图形图像、动画、视频（4）Microsoft Frontpage（或SharePoint Designer）、Adobe Dreamweaver2、问答题(1)www的特点有哪些？答：1）万维网是无数个网络站点和网页的集合，它们在一起构成了因特网最主要的部分。
2）WWW是建立在客户机／服务器模型之上的。
3）WWW是以超文本标注语言HTML(Hyper Markup Language)与超文本传输协议HTTP(Hyper Text Transfer Protocol)为基础。
4）WWW能够提供面向Internet服务的、一致的用户界面的信息浏览系统。
5）WWW浏览提供界面友好的信息查询接口。
(2)网页的基本元素有哪些？答：组成网页的元素主要有文字、图像、声音、动画、视频、超链接以及交互式处理等。
它们的特点如下：文字：网页中的大多数信息主要以文本方式显示，文字是网页的主体，负责传达信息的功能。
图像：图片给网页添加了色彩，使网页做到了图文并茂，形象生动。
动画：动画是动态的图形，添加动画可以使网页更加生动。
常用的动画格式包括动态GIF图片和Flash动画声音和视频：声音是多媒体网页中的重要组成部分，支持网络的声音文件格式很多，主要有MIDI、WA V、MP3和AIF等。
网页中支持的视频文件格式主要有Realplay、Mpeg、A VI和DivX等。
表格：在网页中使用表格可以控制网页中信息的结构布局。
超链接：超链接是网页与其他网络资源联系的纽带，是网页区别于传统媒体的重要特点导航栏：导航栏的作用是引导浏览者游历所有站点。
表单：表单类似于Windows程序的窗体，用来将浏览者提供的信息，提交给服务器端程序进行处理。
其他常见元素：包括悬停按钮、Java特效和ActiveX等各种特效。
《第5章第1节创建演示文稿——整理规划及添加内容》作业设计方案-初中信息技术河大版23第一册自编模拟
《创建演示文稿——整理规划及添加内容》作业设计方案（第一课时）一、作业目标本课时的作业目标主要是通过学生的实践操作，达到对演示文稿制作流程的理解和基本操作技能的掌握。
使学生能够学会演示文稿的整理规划、结构安排以及内容填充的基本方法，提升其信息技术操作能力，培养良好的逻辑思维与信息表达能力。
二、作业内容本课时作业内容包括演示文稿的整理规划、主题选定和内容填充三个部分。
1. 整理规划：学生需根据所给主题（如“我的校园生活”），对演示文稿进行整体布局规划，包括确定幻灯片的数量、每页幻灯片的主题内容以及整体风格设计等。
2. 主题选定：学生需围绕主题，选择合适的素材（如图片、文字、图表等），明确每页幻灯片要表达的核心内容。
3. 内容填充：在完成上述规划与选材后，学生需开始逐页填充具体内容，包括但不限于文字描述、图片插入、表格制作等。
同时，需注意内容的逻辑性、美观性和可读性。
三、作业要求本课时作业要求学生按照以下要求进行：1. 演示文稿的规划应合理，结构清晰，各页之间应有逻辑连贯性。
2. 素材的选择应与主题相符合，注重素材的原创性和合法性。
3. 文字表述应简洁明了，图片和图表的使用应恰当且具有代表性。
4. 颜色搭配要协调，保持整体风格的一致性。
5. 遵守课堂纪律，独立完成作业，不抄袭他人成果。
四、作业评价教师将根据以下标准对作业进行评价：1. 创意与构思：作品是否具有创意和独特构思。
2. 逻辑与结构：演示文稿的结构是否清晰，各部分之间的逻辑关系是否紧密。
3. 内容与素材：内容是否丰富且与主题相关，素材的选择是否恰当。
4. 技术应用：操作是否规范，技术运用是否得当。
5. 美观度：整体美观度及颜色搭配的协调性。
五、作业反馈教师将对学生的作业进行批改，指出存在的问题及改进建议，并选取优秀作品进行展示和表扬。
同时，学生需根据教师的反馈意见进行修改和完善，不断提高自己的信息技术操作能力和演示文稿制作水平。
此外，鼓励学生之间互相交流学习，分享制作经验和技巧。
Word如何创建目录和超链接实现文档导航
Word如何创建目录和超链接实现文档导航在日常工作和学习中，我们经常需要处理大量的文档和资料。
为了方便查阅和导航，我们可以利用Word软件中的目录和超链接功能，实现文档的快速定位和跳转。
本文将介绍如何创建目录和超链接，以便更高效地管理文档。
一、创建目录目录是文档中的一个重要组成部分，通过目录可以清晰地展示文档的结构和内容。
在Word中，我们可以利用“目录”功能自动生成目录，省去手动编写的繁琐过程。
首先，在文档的开头或适当位置插入一个空白页，用于放置目录。
然后，将光标定位到该页，点击Word菜单栏中的“引用”选项卡，在“目录”组中选择“目录”按钮。
在弹出的菜单中，可以选择“自动目录1”、“自动目录2”等不同的样式，根据需要选择一个适合的样式。
Word会自动扫描文档中的标题和标题样式，并生成相应的目录。
如果文档中的标题样式不符合要求，可以手动调整样式或者修改标题的样式为“标题1”、“标题2”等。
二、创建超链接目录可以让我们快速定位到文档的特定部分，但是在长文档中，仍然需要进行翻页操作。
为了进一步提高效率，我们可以利用超链接功能，实现在文档内部的快速跳转。
首先，选中需要添加超链接的文本或者图片，然后点击Word菜单栏中的“插入”选项卡，在“链接”组中选择“超链接”按钮。
在弹出的对话框中，可以选择“已有文件或网页”、“新建文档”、“电子邮件地址”等不同类型的链接。
如果选择“已有文件或网页”，可以浏览本地文件或者输入网址，选择需要链接的目标文件或网页。
如果选择“新建文档”，可以在Word中新建一个文档，并将其作为链接的目标。
如果选择“电子邮件地址”，可以输入邮箱地址，并设置邮件主题和正文。
在设置完链接的目标后，点击“确定”按钮，超链接就创建完成了。
此时，选中的文本或者图片将变为蓝色，并且在鼠标悬停时会显示链接的目标。
三、实现文档导航通过创建目录和超链接，我们可以实现文档的快速导航。
在阅读文档时，只需点击目录中的相应章节标题，即可快速跳转到目标位置。
HTML第5章 超 链 接
·64·HTML网页设计参考手册超链接基本知识超链接的建立内部链接书签链接外部链接所谓超链接就是当单击某个字或某个图片时，就可以打开另外一个画面。
它的作用对网页来说相当重要，如果没有它，那便只能在每打开一个页面时就要在地址栏内输入一次地址了。
第5章超链接·65·5.1 超链接基本知识5.1.1 超链接对于初次接触网页设计的读者来说，可能对于超链接的概念还不是很明白。
超链接就是从一个网页转到另一个网页的途径。
超链接是网页的重要组成部分。
如果说文字、图片是网站的躯体，那么超链接就是整个网站的神经细胞，它把整个网站的信息有机地结合到一起。
链接能使浏览者从一个页面跳转到另一个页面，实现文档互联、网站互联。
超文本链接（hypertextlink）通常简称为超链接（hyperlink），或者简称为链接（link）。
链接是HTML的一个最强大和最有价值的功能。
链接是指文档中的文字或者图像与另一个文档、文档的一部分或者一幅图像链接在一起。
5.1.2 绝对路径绝对路径就是主页上的文件或目录在硬盘上的真正路径。
使用绝对路径定位链接目标文件比较清晰，但是有两个缺点：一是需要输入更多的内容，二是如果该文件被移动了，就需要重新设置所有的相关链接。
例如在本地测试网页时链接全部可用，但是到了网上就不可用了。
这就是路径设置的问题。
例如设置路径为“C:\Program files\1.htm”，在本地确实可以找到，但是到了网站上该文件便不一定在这个路径下了，所以就会出问题。
5.1.3 相对路径首先分析一下为什么会发生图片不能正常显示的情况。
举一个例子，现在有一个页面index.htm，在这个页面中链接有一张图片photo.jpg，它们的绝对路径如下：c:\website\index.htmc:\website\img\photo.jpg如果使用绝对路径c:\website\img\photo.jpg，那么在自己的计算机上将一切正常。
网页平面第五章列表与超链接样题A卷
网页平面第五章列表与超链接样题A卷一、选择题。
（每小题2分，共20分）1、下列选项中，定义无序列表的基本语法格式正确的是（）A、<ul><li>列表项1</li><li>列表项2</li>......</ul>B、<ul><ul>列表项1</ul><ul>列表项2</ul>......</ul>C、<ul>......</ul>D、<ul>……</ul><ul>……</ul><ul>……</ul>2、定义有序列表<ol>的（）属性，可以决定有序列表项目符号的类型。
A、valueB、typeC、relD、href3、关于有序列表的描述，下列说法正确的是（）。
A、有序列表没有排列顺序B、有序列表按顺序排列，并不带有序号C、有序列表按顺序排列并通过type属性定义序号样式D、有序列表不可以和无序列表嵌套使用4、关于列表的嵌套，下列说法正确的是（）。
A、无序列表中只能嵌套无序列表B、有序列表中只能嵌套有序列表C、无序列表和有序列表可以相互嵌套D、<li>与</li>之间相当于一个容器，可以嵌套无序列表、有序列表等网页元素5、关于使用list-style复合属性综合设置列表样式的语法格式，下列书写正确的是（）。
A、list-style:列表项目符号列表项目符号的位置列表项目图像B、list-style:列表项目符号、列表项目符号的位置、列表项目图像C、list-style:列表项目符号，列表项目符号的位置，列表项目图像D、list-style:列表项目符号/列表项目符号的位置/列表项目图像6、CSS中，通过链接伪类可以实现不同的链接状态。
网页中使用超链接
第五章网页中使用超超是的魅力所在。
为了把Internet上众多分散的的网页联系起来,构成一个有机的整体,就是在网页上加入。
通过点击网页上的,才能真正实现网络无国界,我们才可以在信息海洋中尽情遨游。
Macromedia Dreamweaver 8提供多种创建超文本的方法,可创建到文档、图像、多媒体文件或下载软件的,可以建立到文档内任意位置的任何文本或图像〔包括标题列表、表、层或框中的文本或图像〕的。
本章主要介绍利用Dresmweaver 创建的编辑各种超的方法。
通过本章的学习,读者应该掌握以下内容；●认识超●掌握利用Dreamweaver创建各种超的方法●掌握利用Dreamweaver编辑各种超的方法●管理超下的方法5.1超基础5．1．1超的种类超为畅游网络提供了方便,它是网页制作中使用比较多的一种技术。
超是用预先准备的好文本、按钮、图像等对象与其他对象建立的一种,也就是源端和目标端点之间的建立一种。
源端点是超的超始端点,也称为源锚；目标端点是的像,也签名为目标锚。
超按源端点的划分,可分为超文本和非超文本两类。
超文本的源锚文本下方有下划线,而非超文本是用除文本之外的其他对象构建的,其源锚可以是图像、表格、列表、表单、多媒体等对象。
超按目标端点的划分,可分为外部、内部、电子、局部、脚本等。
5．1．2文档路径类型掌握从作为起点的文档到作为目标文档之间的文件路径,对于创建至关重要。
文档路径类型有绝对路径和相对路径两种。
1.绝对路径绝对路径是包括服务器协议〔本例中为〕的完全路径,比发如"洪恩在线——电脑乐园",完全路径为; honggen /pe/index..htm.如果要当前站点之外的文档,就必须使用绝对路径。
每个网页都有一个惟一的地址,称为统一资源定位器<URL>。
绝对路径提供文档的完整URL,包括使用的协议<对于网页通常是>。
例如, macromedia /support/dreamweaver/contents.html 就是一个绝对路径。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
根路径综合了绝对路径和相对路径的优点，除了 链接时和当前文档位置无关，还可以在本地站点 中进行测试。
5.2创建超链接
5.1创建内部超链接 内部链接主要是链接站点内部的文件，一般
使用相对路径。常见的有文本链接、图像链接和 热点链接 1.文本链接 2.图像链接 3.图像热区链接
5.2.2 创建锚记超链接
1.使用“插入”菜单创建邮件链接 2.直接给文档创建邮件链接
5.2.4 创建下载超链接
如果需要在网页中提供下载资料，就需要 为文件提供下载链接。如果链接指向的不 是一个网页文件，而是其他格式的文件， 如.rar、 .mp3 、 .exe等，单击链接的时 候就会弹出是否选中下载文件的对话框。
5.2.5 创建脚本超链接
5.1.2 绝对路径
绝对路径就是被链接文档的完整的URL， 而且包含服务器协议。这个地址是精确地 址而不用考虑文件的位置，如果目标文件 被移动，则链接无效。创建外部链接时必 须用绝对路径。
5.1.3 相对路径
相对路径是指以当前文件所在位置为起点 到被链接文件经由的路径。
5.1.4 根路径
根路径是指从站点目录到文档所在位置的路径， 以一个正斜杠“/”开始，该斜杠表示站点根文件夹。
脚本超链接是一种特殊类型的链接，通过 单击带有脚本超链接的文本或对象，可以 运行相应的脚本代码及函数。
5.2.6 创建空链接
空链接是指没有指定链接对象的链接。利 用空链接可以向网页上的对象或文本附加 行为，以便当鼠标指针滑过该链接时 ， 交换图像或显示层等动作。
5.3管理超链接
5.4创建跳转菜单
跳转菜单是页面中的弹出式菜单，在菜单 中列举出链接到文件或文件夹的选项。
5.5创建导航条
导航条由按钮、图像或一组图像组成。导 航条就像网站的桥梁，网站通过它把站点 中的各个页面联系起来，使浏览者更加方 便清晰地在各个页面间进行切换，是网站 的结构更加层次分明。
ቤተ መጻሕፍቲ ባይዱ
思考题
1．绝对路径和相对路径有什么区别？ 2. 如何创建不同形状的热点超链接？ 3. 如何创建邮件超链接？ 4. 创建脚本链接有什么作用? 5. 如何快速检查网页中的超链接？
如果一个网页上的内容过长，那么通过滚动条需 找需要的内容并不是一件容易的事。应用锚记链 接可以在页面内或不同页面内快速定位，找到所 需的内容。创建锚记连接的具体操作步骤如下：
1.插入命名锚记 2.创建锚记链接
5.2.3 创建邮件超链接
邮件超链接是一种特殊的链接方式，其链 接对象为邮箱地址。
本章小结
为了把Internet上众多的网站和网页联 系起来，将其构成一个整体，就要在网页 中加入链接。这样一来，能让浏览者很轻 松地浏览自己想看的内容。所以我们在整 合网站内容后，系统地考虑站点链接的易 用性、条理性尤为重要。总之，掌握超链 接的制作是基础，如何合理的安排、灵活 的运用它才是关键。
5.1.1 URL概述
URL（统一资源定位器）主要用于指定网上资源 的位置和方法。
URL一般由三个部分组成，即协议、主机和域 （1）协议，又成服务方式，如http、ftp、telnet
等。 （2）主机：即存放资源的主机的IP地址，有时
也包括端口号，如： (3)域：主机的具体地址，包括路径和文件名等。
第5章 创建网页超链接
教学目的
介绍了超链接的概念 掌握超链接和导航条的创建方法 会在网页中灵活使用超链接
5.1 超链接的基本概念
一个网站肯定有很多的页面，如果页面之间彼此 是独立的，那么网页就好比是孤岛，这样的网站 是无法运行的，没有意义的。为了建立起网页之 间的联系我们需要实现从一个网页指向另一个目 标的跳转，这个目标可以是另一个网页，也可以 是同一个网页上的不同位置，还可以是一张图片、 一个电子邮件地址、一个文件或一个绝对定位的 元素，甚至是一个应用程序，这就是所谓的超链 接。在创建超链接之前，首先要弄清楚目录和路 径的关系，只有这样才可以轻松管理网站的链接， 创建出结构清晰明确的网站。