第4章在网页中插入图片PPT课件

合集下载

相关主题

1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。

像源文件】对话框，如图所示，在此对话框中选择需要插入的图像文件。
➢或者按【Ctrl+Alt+I】键
首页末页向上向下返回结束调音
首页末页向上向下返回结束调音
➢（3）单击【确定】按钮，如果图像文件在站点外面，就会弹出一个对话框，如图5-23所示。
首页末页向上向下返回结束调音
➢ 剪裁：用于剪裁当前的图像。单击【剪裁】图标后，图像上出现剪裁的选取框，如图5-27所示。
首页末页向上向下返回结束调音
首页末页向上向下返回结束调音
➢ 中间亮的部分是需要保留的区域，四周较暗的部分是要裁掉的部分。用鼠标指针拖动四周的控制点调整剪裁范围，调整好后在图片上双击即可完成裁剪。
首页末页向上向下返回结束调音
➢5.4.4 插入图像占位符
能是指定一个与当前图像画面内容一致，但图像质量低、文件小的图像作为当前图像的载入前图像。目的是使浏览器快速显示该图像。 ➢ 边框：确定是否给图像加边框，没有值表示无边框，值越大边框越粗。 ➢ 对齐：对齐的下拉列表中包括默认值、基线、顶端、居中、底部、文本上方、绝对居中、绝对底部、左对齐、右对齐这10种方式。
首页末页向上向下返回结束调音
➢ 类：在类右边的下拉列表中存放的是图像样式，可以选择需要的样式应用于当前的图像，现在该下拉列表中没有任何东西，但在学习CSS样式后，它的作用就很明显的体现出来了。
➢ 链接：是将当前图像与其他位置的内容链接，实现页面的跳转。其下方的目标是对链接内容的打开方式的设定。
下面介绍【属性】面板中各个参数的含义：文本框：用于设置图像的名称，以便在应用行为、编辑脚本时引用，如制作交换图像、导航条时使用。宽和高：用于设置图像在当前文档中的大小。源文件：显示插入的图像所在的位置，通过它可以将当前的图像更换成其他图像。单击其右边的图标更换图像。替换：设置当图像不能正常显示时的提示文字，如图5-26所示。
GIF格式
GIF全称为“Graphics Interchange Format”，意为可交换图像格式，它是第一个支持网页的图像格式，在PC机和苹果机上都能被正确识别。它最多支持256种颜色，可以使图像变得容量相当小。GIF图像可以在网页中以透明方式显示，还可以包含动态信息，即GIF动画。
➢ （4）单击【确定】按钮，图像就能插入到网页中并将其复制到站点的根目录下。
➢ （5）打开【图像标签辅助功能属性】对话框，如图5-24所示，在此对话框的【替换文本】下拉列表框中可以替换替代图片的文字。
首页末页向上向下返回结束调音
➢5.4.2 设置图像属性
➢ 选中插入的图像，可以在【属性】面板中查看该图像的属性，如图5-25所示。
➢ 亮度与对比度：调整图像的明暗度与对比度，单击【亮度/对比度】图标，打开【亮度/对比度】对话框。在亮度项中拖动滑块即可调整图像的明暗度，滑块越向右图片越亮；在对比度项中拖动滑块即可调整图像的对比度，滑块越向右对比度越强，如图5-28所示。
首页末页向上向下返回结束调音
首页末页向上向下返回结束调音
直接5.4插制入插作入图图像像页面
图像可以在Dreamweaver 8中的【设计】视图或者【代码】视图中被插入到文档里。在Dreamweaver 8的文档中添加图像时，可以设置或者修改图像属性并可直接在文档窗口中查看所作的修改，插入图像的具体步骤如下：
➢ （1）用鼠标指针确定图像的插入点。 ➢ （2）单击【插入》图像】菜单项，打开【选择图
➢ 编辑：单击【编辑】按钮，启动Fireworks程序，在 Fireworks窗口中对当前的图像进行编辑。编辑完毕后，单击Fireworks中的【完成】按钮，将保存所做的修改并应用到Dreamweaver 8的当前图像中，通过该功能可使图像快速得到修改。
➢ 使用Fireworks最优化：单击【使用Fireworks最优化】图标，利用Fireworks对图像进行最优化处理。
首页末页向上向下返回结束调音
JPEG格式
JPEG全称为“Joint Photographic Experts Group”，意为联合图像专家组，它可以高效地压缩图片，丢失人眼不易察觉的部分图像，使文件容量在变小的同时基本不失真，通常用来显示颜色丰富的精美图像。
首页末页向上向下返回结束调音
网页图像的素材有很多来源，如可以使用图形处理软件（如Photoshop、 Fireworks和FreeHand等软件）制作；可以购买网页素材光盘；可以从网络上下载等。
首页末页向上向下返回结束调音
插入图像
➢直接插入 ➢占位符插入 ➢图像的放大显示
首页末页向上向下返回结束调音
PNG格式
PNG全称为“Portable Network Graphics”，意为便携网络图像，它是逐渐流行的网络图像格式。PNG 格式既融合了GIF能透明显示的特点，又具有JPEG处理精美图像的优势，且可以包含图层等信息，常常用于制作网页效果图。
首页末页向上向下返回结束调音
网页图像来源
第4课为网页添加图像
➢ 课堂讲解
首页末页向上向下返回结束调音
课堂讲解
➢网页图像的格式及来源 ➢插入图像 ➢设置图像属性 ➢图像高级设置
首页末页向上向下返回结束调音
网页图像的格式及来源
➢GIF格式 ➢JPEG格式 ➢PNຫໍສະໝຸດ Baidu格式 ➢网页图像来源
首页末页向上向下返回结束调音
➢ 锐化：通过锐化图像，可使图像的边缘更加清晰。单击【锐化】图标，打开【锐化】对话框，拖动【锐化】滑块，可以调整图片的轮廓，滑块越向
右图片的轮廓越明显，如图5-29所示。
首页末页向上向下返回结束调音
➢ 垂直边距：设置图像距上侧和下侧内容的间距。 ➢ 水平边距：设置图像左侧和右侧内容的间距。 ➢ 低解析度源：有些版本中为“低品质原”，其功