网页设计第5章

2020/2/151网页设计三合一教程主讲教师第5章图像的基础及多媒体主讲教师本章要点插入图像设置图像的属性图像编辑添加多媒体及参数设置5.1网页中使用的图像格式简介网页中使用的图像可以是GIF、JPEG、BMP、TIFF、PNG等格式的图像文件。目前主要使用的是GIF和JPEG两种格式。网页中的图像格式一般以GIF为主，如果涉及照片类的图像，则选择JPEG格式。5.2图像的属性5.2.1图像描边的设置5.2.2图文混排的设置5.2.3图片提示5.2.4图像热区的创建5.2.5图像边距的设置5.2.6图像占位符简介5.2.1图像描边的设置设置图像边框选中图像，在【属性】面板的【边框】文本框中输入相应的数字编辑文档中的图像就有了边框。设置描边的粗细可以通过改变【边框】文本框中的数值大小来改变图像描边的粗细。例：设置图像的边框为1像素5.2.2图文混排的设置方法一选中图像，设置【属性】面板上【对齐】下拉菜单中的相应命令进行设置。方法二用鼠标右键单击图像，在弹出的快捷菜单中执行【对齐】|【左对齐】命令。说明：设置完毕后，可以拖曳图片到合适的位置，实现图文混排的效果。例：设置图像在文本的左边5.2.3图片提示方法选中要增加提示的图像，在【属性】面板的【替换】文本框中输入提示的内容即可。效果按F12键预览一下效果，当鼠标的光标停留在图像上时就会显示出提示的文字。例：设置提示文字为“这就是我！”5.2.4图像热区的创建方法在【属性】面板中分别单击3个按钮，可以在图像上建立3种不同形状的热区。效果鼠标指针经过图像热区时会发生相应的变化，提示这是一个超级链接。例：设置“链接到洪恩在线！”5.2.5图像边距的设置方法在【属性】面板分别设置【垂直边距】和【水平边距】的值即可。效果可以使图像和表格边框产生一个边距，也会与相邻的文字或者其他图片产生一个边距。例：设置【垂直边距】和【水平边距】的值都为“20”。5.2.6图像占位符简介什么是图像占位符图像占位符就是在需要使用图形的地方先插入一个占位图形。方法执行【插入】|【图像对象】|【图像占位符】命令，弹出【图像占位符】对话框，在该对话框中进行相应的设置即可。例：设置一个宽750，高140的红色占位符。5.3对图像进行编辑5.3.1修改图片的大小5.3.2编辑图片5.3.3裁剪图像5.3.4修改图像的亮度和对比度5.3.1修改图片的大小方法一通过拖曳图像右侧、底边和右下角的控制手柄可以调整图像的大小。方法二在【属性】面板中直接修改图像的【宽】和【高】的数值也可改变图像的大小。说明单击【属性】面板上的按钮可恢复图像原来的大小。5.3.2编辑图片方法通过【编辑方式】命令对图像进行修改和处理，默认的是Fireworks软件。说明在【首选参数】对话框选择图片编辑器。例：设置默认的GIF图像处理软件5.3.3裁剪图像方法使用【属性】面板中【裁剪】按钮对图像进行裁剪。撤销修改执行【编辑】|【撤销】命令可以撤销所做的任何更改。说明裁剪过程本身就是对该图像文件的操作。例：裁剪图像举例5.3.4修改图像的亮度和对比度方法单击【属性】面板上【亮度和对比度】按钮，在弹出的【亮度/对比度】对话框中进行亮度和对比度的设置。扩展单击【属性】面板中的【锐化】按钮，在弹出的【锐化】对话框中可以进行锐化的设置。例：亮度/对比度举例5.4多媒体的添加及参数的设置5.4.1Flash动画效果的设置5.4.2Flash文本对象的插入5.4.3Flash按钮的简单制作5.4.4多媒体类型的添加5.4.1Flash动画效果的设置方法首先将Flash文件存入swf文件夹内；在需要插入动画的文件中建一个1行1列的表格；执行【插入】|【媒体】|【Flash】命令，在表格中插入Flash文件。扩展在【参数】对话框中的【参数】下输入“wmode”，在【值】的下面输入“transparent”，可使动画出现透明效果。例：为donghua.htm添加top.swf文件，并设置透明效果。5.4.2Flash文本对象的插入方法执行【插入】|【媒体】|【Flash文本】命令，弹出【插入Flash文本】对话框，在该对话框中可以设置动画效果。扩展选中动画文字后，单击【属性】面板中的【编辑】按钮可对该动画文字进行修改。例：鼠标在文字外时文字以红色显示；鼠标在文字上时以蓝色显示。5.4.3Flash按钮的简单制作方法执行【插入】|【媒体】|【Flash按钮】命令，弹出【插入Flash按钮】对话框。在该对话框中进行相应的设置可以制作出Flash按钮。说明文件夹名用字母或者数字组成。例：制作一组按钮，当鼠标移动到按钮上时左边的五角星开始转动。5.4.4多媒体类型的添加说明在浏览器中访问Shockwave电影、Flash动画、MIDI音乐等媒体对象时必须借助插件，通过下载插件才可以看到更多的媒体类型。例：插入Shockwave影片。首先将光标定位到要出现影片的位置；然后单击【媒体】下拉菜单中的【Shockwave】选项或者执行【插入】|【媒体】|【Shockwave】命令；在弹出的对话框中选择Shockwave影片的文件路径。例：插入一个MIDI文件“sound.mid”。例：给主页添加视频动画。首先准备视频动画文件“1.wmv”。单击【媒体】下拉菜单中的【插件】选项或者执行【插入】|【媒体】|【插件】命令，在弹出的对话框中选择“1.wmv”文件。单击【确定】按钮，选中插入的wmv文件，在【属性】面板中设置相应的【宽】和【高】即可。