文档介绍:该【Dreamweaver网页设计与制作案例教程课件 】是由【bai1968104】上传分享,文档一共【86】页,该文档可以免费在线阅读,需要了解更多关于【Dreamweaver网页设计与制作案例教程课件 】的内容,可以使用淘豆网的站内搜索功能,选择自己适合的文档,以下文字是截取该文章内的部分文字,如需要获得完整电子版,请下载此文档到您的设备,方便您编辑和打印。图文并茂的网页—文本与图像的应用
项目4
知识要点
掌握插入文本及特殊字符的方法
1
掌握的格式化文本的方法
2
掌握创建列表的方法
3
4
5
6
掌握插入图像及占位符的方法
掌握图像的编辑方法
掌握鼠标经过图像及导航条的制作方法
:向“首页”页面中插入文本或图像元素
在上一章使用表格完成“乐途网”首页布局的基础上,本章将把网页的主要元素文本及图像插入到布局表格中,使网页具有丰富多彩的内容。首页中主要插入了文本、图像、图像占位符等,并制作了用于超链接的网页元素——导航条,网页效果如图所示。
“首页”页面效果
步骤1启动DreamweaverCS4,在【标准】工具栏上单击“打开”按钮,在弹出的【打开】对话框中,如图所示,;打开的网页文件如图所示,需要向表格中插入文本及图像等元素。
选择文件
使用表格布局的“首页”页面
步骤2在“顶部”表格的logo单元格内定位光标,执行【插入】|【图像】菜单命令,弹出【选择图像源文件】对话框,如图所示,选择图像:logo,单击“确定”按钮。
选择图像文件
步骤3如果没有预先保存网页,并显示如图所示的对话框,提示要先保存网页,单击“确定”按钮。
步骤4提示所选择的图像不在本地站点“letuweb”下,建议拷贝到“letuweb”下,如图所示,单击“是”按钮。
“保存文档”提示信息
“复制图像”提示信息
步骤5弹出【复制文件为】对话框,如图所示,将“”保存在文件夹:D:letuweb\daohang中,单击“保存”按钮。
步骤6弹出的【图像标签辅助功能属性】对话框,如图所示,可以设置图像的辅助属性,也可以直接单击“确定”按钮。
【复制文件为】对话框
设置图像标签辅助功能属性
步骤7在【图像】属性面板中设置图像宽:210、高:90等属性,如图所示;效果如图所示。
设置“logo”图像大小
插入“logo”效果
步骤8用同样的方法插入“顶部”图像:、,在【图像】:890、高:40,:480、高:90,效果如图所示。
插入“顶部”图像效果
步骤9在“左部”表格的1行2列定位光标:执行【插入】|【图像】菜单命令,弹出【选择图像源文件】对话框,如图所示,,单击“确定”按钮。
选择图像源文件