您好,欢迎访问三七文档
当前位置:首页 > 商业/管理/HR > 咨询培训 > Dreamweaver-CS5网页制作高级案例教程项目四
项目四创建“欧妮雅”化妆品网站——应用超链接和行为一、学习目标二、理论指导三、任务实践一、学习目标掌握常规超链接、图片链接、下载链接和电子邮件链接的设置方法,了解热点链接和命名锚记链接的设置方法。认识“行为”面板,能够应用行为制作“弹出信息”、“打开浏览器窗口”和“图片渐变”等效果。能够在实践中根据需要熟练地为网页元素设置超链接。二、理论指导(一)应用超链接超链接由源端点和目标端点两部分组成,其中设置了链接的一端称为源端点,跳转到的页面或对象称为目标端点。网站是由一个个网页组成的,而连接这些网页的桥梁就是超链接。超链接包括很多种,最常用的是常规超链接,另外还有图片链接、下载链接、电子邮件链接等。1.设置常规超链接(1)内部超链接内部超链接的设置非常灵活,在选中要设置超链接的文本或图像后,可以在属性检查器上的“链接”编辑框中直接输入要链接对象的相对路径;也可以通过单击“链接”编辑框右侧的“浏览文件”按钮,在弹出的“选择文件”对话框中选择链接对象。(2)外部超链接外部超链接的设置,一般是在选中对象后,在属性检查器上的“链接”编辑框中直接输入要链接网页的网址。2.设置图片链接和下载链接所谓图片链接,就是在单击网页中的某个小图片时在新窗口中打开一幅大图片;下载链接是指单击某个超链接时会打开一个“文件下载”对话框(或自动启动下载工具),通过在该对话框中单击“打开”或“保存”按钮,可以打开或下载文件。3.设置电子邮件链接使用电子邮件链接可以非常方便地给网站管理者发送邮件。很多网页下方的信息区都留有电子邮件地址,单击该地址可打开“OutlookExpress”的“新邮件”窗口,这就是电子邮件链接。4.设置热点链接热点链接又叫图像映射,就是使用热点工具将一张图片划分成多个区域,并为这些区域分别设置链接。5.设置命名锚记链接命名锚记链接主要用于比较长的网页。其源端点和目标端点位于同一个网页中,单击它可以从源端点跳到目标端点(通常源端点位于网页下方,目标端点位于网页上方)。要设置命名锚记链接,应首先插入命名锚记(相当于目标端点),然后创建跳转到该命名锚记的链接。(二)应用行为1.认识行为要应用行为,首先需要打开“行为”面板。在DreamweaverCS5中,选择“窗口”“行为”菜单(或按【Shift+F4】组合键)可打开“行为”面板。2.应用行为行为可以应用于HTML标签、图像、链接文本等对象。如果要对某个对象应用行为,需要先选中该对象,然后单击“行为”面板上的“添加行为”按钮,在打开的行为列表中选择动作,并在打开的窗口中设置效果,最后指定设定的动作在什么情况下发生,也就是指定事件。(1)“弹出信息”行为有时候,我们在打开某个网页或单击网页中的某个元素时可以看到弹出信息框。应用“弹出信息”行为可以轻松实现该功能。(2)“设置状态栏文本”行为所谓“状态栏文本”,就是网页运行时在浏览器下方的状态栏中显示的文本。3.编辑行为(1)修改行为修改行为的方法非常简单,只需双击“行为”面板中相应的动作名称,比如要编辑前面的“设置状态栏文本”行为,只要双击“事件”右侧对应的动作名称“设置状态栏文本”,就会重新打开“设置状态栏文本”对话框,修改后关闭对话框即可。(2)删除行为如要删除某行为,只需选中该行为,然后单击“行为”面板上方的“删除事件”按钮或直接按【Delete】键。也可用鼠标右键单击行为,在弹出的快捷菜单中选择“删除行为”命令。(3)获取更多行为单击“行为”面板上的“添加行为”按钮,在弹出的下拉列表中选择“获取更多行为”命令,将打开Adobe公司的官方网站,该网站提供网页行为的下载。下载行为后还需要安装才能使用。三、任务实践任务一为网站主页设置超链接本任务将为已经制作好内容的文档“index.html”设置超链接(具体操作见视频4-1)。任务二为网站子页设置链接本任务将为已经制作好内容的文档“sub2.html”设置链接(具体操作见视频4-2)。任务三为网站首页添加伴随窗口本任务将应用行为为任务一中制作的网页“index.html”添加伴随窗口(具体操作见视频4-3)。
本文标题:Dreamweaver-CS5网页制作高级案例教程项目四
链接地址:https://www.777doc.com/doc-6422905 .html