为网页添加图像.pptVIP

第4课 为网页添加图像 课堂讲解 上机实战 课堂讲解 网页图像的格式及来源 插入图像 设置图像属性 图像高级设置 网页图像的格式及来源 GIF格式 JPEG格式 PNG格式 网页图像来源 GIF格式 GIF全称为“Graphics Interchange Format”，意为可交换图像格式，它是第一个支持网页的图像格式，在PC机和苹果机上都能被正确识别。它最多支持256种颜色，可以使图像变得容量相当小。GIF图像可以在网页中以透明方式显示，还可以包含动态信息，即GIF动画。 JPEG格式 JPEG全称为“Joint Photographic Experts Group”，意为联合图像专家组，它可以高效地压缩图片，丢失人眼不易察觉的部分图像，使文件容量在变小的同时基本不失真，通常用来显示颜色丰富的精美图像。 PNG格式 PNG全称为“Portable Network Graphics”，意为便携网络图像，它是逐渐流行的网络图像格式。PNG格式既融合了GIF能透明显示的特点，又具有JPEG处理精美图像的优势，且可以包含图层等信息，常常用于制作网页效果图。 网页图像来源 网页图像的素材有很多来源，如可以使用图形处理软件（如Photoshop、Fireworks和FreeHand等软件）制作；可以购买网页素材光盘；可以从网络上下载等。 插入图像 直接插入 占位符插入 图像的放大显示 直接插入 选择[插入]?[图像]菜单命令。 单击插入栏的“常用”选项卡中的按钮。 按【Ctrl+Alt+I】键。 占位符插入 制作网页时还未选定需插入的图像，但确定了图像大小的时候，可以使用占位符来代替图像的方式插入到文档中。 将图像确定后双击占位符，在打开的对话框中设置后插入即可。 三、占位符 1、插入占位符 （1）插入 单击【插入】→【图像对象】→【图像占位符】命令 单击【常用】插入栏中的图像按钮的小三角，在下拉 菜单中选择【图像占位符】命令 （2）设置对话框 【名称】：输入当前图像占位符的名称，必须输入字母或数字，但是不能以数字开头。 【宽度和高度】：输入当前图像占位符的宽度和高度，单位是像素。 【颜色】：选择当前图像占位符的颜色。 【替换文本】：设置当鼠标指向图像占位符时提示说明性的文字 2、占位符属性 选择该图像占位符，可以在【属性】面板中重新设置其名称、宽高、链接、颜色、替代等内容 3、占位符的浏览 设置图像占位符的各项属性参数之后，单击【标准】工具栏中的【保存】按钮（或者按【Ctrl+S】组合键）即可保存当前的网页文件。然后按【F12】快捷键，可以在默认的浏览器中浏览该图像占位符的效果。 4、制作一个占位符名称为photo，宽高分别为200*160，颜色为#000000，替换文本为“图像”。 5、占位符HTML img src=“”alt=“鼠标指上时的说明” name=“英文称”width=“宽”height=“高”style=“background-color: 占位符颜色 / 2、　图像的基本操作 （1）选择图片 （2）复制图片 选择图片，单击【标准】工具栏中的【复制】按钮或 按【Ctrl+C】，把光标箭头移动到新的位置，再单击【粘 贴】按钮或者按【Ctrl+V】即可。 （3）删除图片 单击选择图片，然后单击【标准】工具栏中的【剪切】 按钮或者按【DeI】就可以把选择的图片删除 。 设置图像属性 在网页中插入图像后可通过属性面板对其属性进行修改等设置。 图像命名 为了在使用Dreamweaver行为（如交换图像）或脚本撰写语言（如JavaScript或VBScript）时可以引用该图像，可在属性面板的“图像”文本框中为图像命名。 图像大小 在Dreamweaver 8中插入图像后系统会自动将图像的原始大小显示在“宽”和“高”文本框（以像素为单位）中。 编辑图片 在网页中选择图像之后，单击属性面板中的按钮，打开图像处理软件，对图像进行处理。如果安装了Fireworks，那么Fireworks将被默认为图像处理软件。如果没有安装，用户也可自己设置使用其他软件中处理图像。 源文件设置 在属性面板的“源文件”文本框中显示了图像的保存路径，如果要重新插入一幅新图像，可以在选取图像后的属性面