边做边学——Dreamweaver CS3网页设计案例教程 官辛华 04新.pptVIP

本章简介： 网络中的每个网页都是通过超链接的形式关联在一起的，超链接是网页中最重要、最根本的元素之一。浏览者可以通过鼠标单击网页中的某个元素，轻松地实现网页之间的转换或下载文件、收发邮件等。要实现超链接，还要了解链接路径的知识。 * 第4章　超链接 课堂学习目标 超链接的概念与路径知识 文本超链接 图像超链接 命名锚记超链接 热点链接 4.1　创业在线网页 案例分析 设计理念 操作步骤 相关工具 4.1.1　案例分析 本例是网络公司制作的创业在线网，该网站汇聚了大量创业项目，打造专业性创业类互动行业平台。在网页设计布局上要清晰合理，设计风格上要体现出创业的信息和国际化氛围。 4.1.2　设计理念 在网页设计、制作过程中，通过蓝色地图的效果营造出国际创业平台的氛围。右上角的导航设计简单清晰，使浏览者一目了然。下方橙色条的点缀让整个界面充满时代感。整体设计在视觉上相对集中、醒目，画面清晰雅致。 创业在线网页效果图 4.1.3　操作步骤 1 2 3 4 4.1.4　相关工具 1. 超链接的概念与路径知识 超链接的主要作用是将物理上无序的内容组成一个有机的统一体。超链接对象上存放某个网页文件的地址，以便用户打开相应的网页文件。在浏览网页时，当用户将鼠标指针移到文字或图像上时，鼠标指针会改变形状或颜色，这就是在提示用户：此对象为链接对象。单击这些链接对象，就可完成打开链接的网页下载文件、打开邮件工具收发邮件等操作。 2.创建文本链接 创建文本链接的方法非常简单，主要是在链接文本的“属性”面板中指定链接文件。指定链接文件的方法有3种。 直接输入要链接文件的路径和文件名 使用“浏览文件”按钮 使用指向文件图标 3.文本链接的状态 一个未被访问过的链接文字与一个被访问过的链接文字在形式上是有所区别的，以提示用户链接文字所指示的网页是否被看过。设置文本链接状态的具体操作步骤如下。 （1）选择“修改 页面属性”命令，弹出“页面属性”对话框。 （2）在对话框中设置文本的链接状态。选择“分类”列表框中的“链接”选项，单击“链接颜色”选项右侧的图标，打开调色板，选择一种颜色来设置链接文字的颜色。 4.下载文件链接 浏览网站的目的往往是查找并下载文件，下载文件可利用下载文件链接来实现。建立下载文件链接的步骤如同创建文字链接，区别在于所链接的文件不是网页文件而是其他文件，如.exe、.zip等文件。 建立下载文件链接的具体操作步骤如下。 （1）在文档窗口中选择需添加下载文件链接的网页对象。 （2）在“链接”选项的文本框中指定链接文件。 （3）按F12快捷键预览网页。 5.电子邮件链接 网页只能作为单向传播的工具，将网站的信息传给浏览者，但网站建立者需要接收使用者的反馈信息，一种有效的方式是让浏览者给网站发送E-mail。在网页制作中使用电子邮件超链接就可以实现。 每当浏览者单击包含电子邮件超链接的网页对象时，就会打开邮件处理工具（如Outlook Express），并且自动将收信人地址设为网站建设者的邮箱地址，方便浏览者给网站发送反馈信息。 利用“属性”面板建立电子邮件超链接 利用“电子邮件链接”对话框建立电子邮件超链接 4.1.5 实战演练-精品家居网页 使用“属性”面板为文字制作空链接效果，使用“电子邮件链接”按钮制作电子邮件链效果。 效果图 4.2　恋之语素材模板网页 案例分析 设计理念 操作步骤 相关工具 4.2.1　案例分析 素材模板网页可以帮助用户设计出精美的照片或电子相册。本例是为影楼公司制作的模板下载网页，主要提供婚纱模板、写真模板、儿童模板、样片相册、亲子相册、影视教学等内容。在设计模板素材网页时要注意界面的时尚美观，布局的合理搭配，并体现出现代感和流行元素。 4.2.2　设计理念 在网页设计、制作过程中，背景采用天蓝色，使页面清新明快，导航栏放在页面的右上角，方便用户浏览。左下方是包含图层的模板下载区域，方便用户使用和下载。右下方是儿童模板区域，设计新颖独特。 恋之语素材模板网页效果图 4.2.3　操作步骤 1 2 3 4 4.2.4　相关工具 1.图像超链接