电子商务网页制作教学课件ppt作者谢嵘05课件.ppt

主编：谢嵘 项目导学 网页中包括文本、图片、链接等要素，在网页中添加适当的图片并对其进行处理，能使网页看起来更加美观、生动。本项目将详细介绍在网页中添加图像以及如何对它进行编辑处理的方法。 体验活动一：在页面中添加图像 活动任务： 在“好书热评”页面中直接插入图像文件；通过插入占位符来添加图像。 活动指导： 网页中图片的添加不宜过多过杂，图片的选择一定要符合网页的主题，在素材中应选取最具代表性，比较清晰的图片来美化网页。在网页中的图像还可以添加鼠标经过效果，这样可使网页看起来更加生动、美观，要特别注意的是尽量使用两张大小基本一致的图片来创建。 体验活动一：在页面中添加图像 活动步骤： 在Dreamweaver中打开网页，将光标定位在需要插入图片的位置。 在“插入”菜单下点选“图像”命令，或者单击“常用”工具栏中的“图像”按钮。 体验活动一：在页面中添加图像 活动步骤： 在对话框的查找范围中选择图片所在的文件夹，点选需要插入的图片。 如果所选择的图片不在当前网页的网站文件夹中，那么会弹出对话框，此时单击“是”按钮。 体验活动一：在页面中添加图像 活动步骤： 点击“images”文件夹，单击“保存”按钮，图像文件一般保存在“images”文件夹中。 当浏览网页时图片无法显示，或者当鼠标指向图片时就会显示 “替换文本”中所输入的内容。 体验活动一：在页面中添加图像 活动步骤： 图片添加图像后的效果。 在网页左边需要插入图像的位置定位光标。 体验活动一：在页面中添加图像 活动步骤： 在“插入”菜单下点选“图像对象/图像占位符”命令。 在弹出的“图像占位符”对话框中输入图像的名称和宽度、高度。 体验活动一：在页面中添加图像 活动步骤： 图像占位符上显示了图像的名称以及大小。 在图像占位符的区域内双击，在对话框的查找范围中选择图片所在的文件夹，点选需要插入的图片。 体验活动一：在页面中添加图像 活动步骤： 首先将鼠标定位在要创建鼠标经过图像的位置，再从“插入”菜单中点选“图像对象/鼠标经过图像”命令。 在弹出的对话框中设置“原始图像”、鼠标经过图像”的图片，然后再设置“前往的URL”中设置链接网址即可。 活动小结 在完成了以上体验活动后，根据操作步骤请填写完后面的操作。 体验活动二：Dreamweaver 内置编辑器编辑图像 活动任务： 设置字号、字体颜色和显示位置。 活动指导： 通过编辑图像设置可对图像作一些基本的处理。 体验活动二：Dreamweaver 内置编辑器编辑图像 活动步骤： 在网页中选中所要编辑的图像，点击属性栏中的图标 。 点击图像编辑设置后，在弹出的“图像预览”中可对图片进行处理。 体验活动二：Dreamweaver 内置编辑器编辑图像 活动步骤： 如果对网页中的图像品质不满意，可以重新设置品质的参数，数字越大品质越高图像越清晰，反之图像就越模糊。 通过设置“平滑”参数可使图像线条看起来更加的柔和，数字越大图像会越柔和。 体验活动二：Dreamweaver 内置编辑器编辑图像 活动步骤： 在“文件”选项卡中，可设置缩放的百分比或是直接输入高与宽的像素值来改变图像的大小。 活动小结 在完成了以上体验活动后，根据操作步骤请填写完后面的操作。 体验活动三：通过“页面属性”在网页中添加背景 活动任务： 在“好书热评”页面中添加背景图像。 活动指导： 为网页添加背景图像时要注意素材的选取，一般色彩淡雅、像素较高的图片作为背景会使整个网页锦上添花， 添加的背景图像一定不能遮住网页的文本，否则影响信息的传达。 体验活动三：通过“页面属性”在网页中添加背景 活动步骤： 鼠标在网页的空白处单击一下，在“属性”栏中点击“页面属性”按钮。 在弹出的“页面属性”对话框中点击“背景图像”后面的“浏览”按钮。 体验活动三：通过“页面属性”在网页中添加背景 活动步骤： 在“选择图像源文件”对话框中找到要设为背景的图像文件，并单击“确定”按钮。 选择“是”按钮，将图片保存在本站点内。 体验活动三：通过“页面属性”在网页中添加背景 活动步骤： 在弹出的“复制文件为”对话框中选择“images”文件夹，然后单击“保存”按钮即可。 此时“背景图像”后面的文本框内显示出所选图像的名称，点击“确定”按钮。 体验活动三：通过“页面属性”在网页中添加背景 活动步骤： 添加背景后的效果如图。 体验活动四：通过“标签检查器”在网页中添加背景 活动任务： 在“好书热评”页面中添加背景图像。 活动指导： 在网页中利用“标签检查器”也能为网页添加背景。 体验活动四：通过“标签检查器”在网页中添加背景 活动步骤： 单击属性栏上方的“body”标签。 在“标签检查器”中在“backgro