Dreamweaver8网页设计必会300例 张微.pdfVIP

第 章 网页中的图像处理 6 个好的网页除了文本之外，还应该有绚丽的图片来渲染，在页面中恰到好处地使用图 像，能使网页更加生动、形象和美观，图像是网页中不可缺少的元素之 。本章将介绍 网页中的交互式图像、网页背景与图像映射等知识。 问题080 怎样在页面中插入图像 在Dreamweaver 8 中，可以直接在页面中插入图像，也可以将图像作为页面的背景。 操作步骤 步骤01 打开网页文档q80_or i.htm，然后切换到“常用”插入栏，单击“图像“按 钮右侧的三角形，在弹出的菜单中选择 “图像”选项，如图6 -1 所示。 步骤02 弹出 “选择图像源文件”对话框，如图6-2 所示，选择需要插入的图像文件， 单击“确定”按钮即可在网页中插入该图像。 选择 “图 像”选项 选择图像文件 图6-1 选择 “图像”选项 图6 -2 “选择图像源文件”对话框 在对话框的“相对于”下拉列表中可以选择文件U RL 地址的类型。选择 “文档”，则 使用相对地址；选择 “站点根目录”，则使用基于根目录的地址。在对话框中选中“预 览图像”复选框，可以在对话框右边预览图像。 Dreamweaver 8 网页设计必会300例 步骤03 如果图片在站点外部，Dreamweaver 8 会提示要保存在站点内部，单击“是” 按钮，然后选择本地站点的路径，保存图片，如图6-3 所示。确认后，会弹出如图6-4 所示的 对话框，提醒输入替换文本和详细说明，可暂时不填写，稍后在“属性”面板中设置即可。 单击“取消”按钮，图像就被插入到了页面中，如图6-5 所示。 图6-3 拷贝图像 图6-4 图像辅助功能属性 步骤04 按F12快捷键预览页面，可以看到页面中插入的图像效果，如图6-6 所示。 图6-5 插入的图像 图6-6 预览效果 问题081 图像占位符的作用是什 在制作网页时，在页面中某个位置需要插入 幅图片，但 时找不到喜欢的、合适的 图片，又不想随便找个图片，这时就需要用到Dreamweaver 8 的图像占位符功能。插入图 像占位符后，随时都可以将其替换为真正的图像。有时根据布局的安排，需要在网页中插 入 幅图片，此时可以先不制作图片，而使用占位符来代替图片的位置，等布局好网页以 后，再使用占位符来启动Fireworks 8 创建图片。 问题082 怎样插入图像占位符 图像占位符并不是最终显示的图像，它只是 种临时的、替补的图形，不仅可以设置 图像占位符的大小和颜色，还可以为图像占位符提供文本标签。 操作步骤 步骤01 单击“常用”插入栏中“图像”按钮旁边的小三角形，在弹出的菜单中选择 110 第 章 网页中的图像处理 6 “图像占位符”选项，如图6-7 所示。 步骤02 在弹出的“图像占位符”对话框中可以设置占位符的属性，如图6-8 所示。在 “名称”文本框中输入要插入图片的名称，在“高度”和“宽度”文本框中输入图片高度和 宽度的数值，在“颜色”选择器中可以设置占位符的颜色，在“替换文本”文本框中输入图 片的说明文字。在浏览器中，当光标停留在“图像占位符”上时，将弹出一个文本框，其中 显示 “替换文本”文本框中的说明文字。 选择 “图像占 位符”选项 图6-7 插入图像占位符 图6-8 设置图像占位符 步骤03 设置完毕后，单击“确定”