DreamweaverCS3网页制作制作者:08级计科师范班34号黄由之学习提要了解目前因特网上的图像格式学习插入图像设置图像属性了解其他图像元素的插入这节课你必须掌握的:能自己制作一个简单的图像页面,插入图像并根据需要改变图像属性,能掌握图像占位符的使用和鼠标经过图像的使用。打开看看图像格式GIF:采用LZW无损压缩算法。最多只能包含256种颜色、支持透明的背景色、支持动画格式。GIF格式擅长表现一些徽标、文字图像或卡通形象等。GIF图片支持动画,其动画的显示不需要特定的插件,较之FLASH动画有一些不可取代的优势。JPEG:采用有损压缩算法。JPEG图像不支持24色真彩色也不支持透明的背景色。善于表现色彩丰富、物质形状结构复杂的图像。JPEG格式的图像会有高、中、低质量的选择。对于Web浏览器而言,选用中、低质量的JPEG图像就可以了。PNG:PNG图像虽然收到了W3C组织的推荐,在网络上已经逐渐开始被使用,但依然不广泛。其原因之一是只有较高版本的浏览器才支持这种图像格式,而且也不是对PNG文件的所有特性都能很好地支持。插入图像Step1单击图标打开“选择图像源文件”的对话框Step2选择所需插入的图像,单击确定,弹出“图像标签辅助功能属性”PS:可以输入图像的替换文本内容以及详细说明。一般情况下不需要添加辅助功能属性,可以在“编辑”——“首选参数”中更改辅助功能。需要注意的是,如果图像在站点外部,则会弹出对话框提醒用户是否将图片保存在站点内部,一般我们单击“是”按钮,然后选择本地站点的路径,即可将图像保存。将所需要的图片、FLASH等多媒体文件保存在站点内部,便于日后网站的修改和管理。设置图像属性属性面板的打开1.窗口——属性2.快捷键Ctrl+F3,可以方便的隐藏或打开属性面板下面简单介绍一下图像属性面板中常用的一些属性的作用。1.图像:用来设置图像的ID,为图像定义名称,主要是为了在脚本语言中便于引用,一般可不填写。2.宽与高:分别用来设置图像的宽度和高度,可以填入数值,单位为像素。3.源文件:用来设置这个图像的路径。4.连接:用来设置这个图像的超链接5.垂直边距:用来设置图像顶部与其上方的其他页面元素及图像底部与其下方的其他页面元素的距离。水平边距:用来设置图像左侧与其左侧方的其他页面元素及图像右侧与其右方的其他页面元素的距离。6.边框:该文本框右侧的三个按钮只要控制图像在浏览器中成左对齐、居中与右对齐。插入其他图像元素其他图像元素有图像占位符、鼠标经过图像、FireworksHTML、导航条、绘制矩形热点、绘制椭圆热点、绘制多边形热点。单击“插入”工具栏的“常用”选项卡中的“图像”按钮旁的小三角形,可以看见可插入网页的除了“图像外”还有以上的这些选项下面我们介绍图像占位符和鼠标经过图像这两种图像元素的使用方法。图像占位符:有时因为布局的需要,要在网页中插入一幅图像。此时可以先不制作图片,而使用占位符来代替图片的位置。与图像一样,可以通过属性面板修改属性。点击这里观看效果鼠标经过图像:鼠标经过图像是制作在页面中当鼠标经过图像时所产生的效果,它可以解决网页中的图像在页面中静态的单调,从而为页面增添生动活泼的气息。点击这里查看网页效果学习效果测试GIF图像的优点有()A支持动画格式B支持透明背景C无损伤方式压缩D支持24位真彩色下面有关JPGE格式图像的说法错误的是()A是一种有损压缩格式B使用专门的JPGE压缩工具,压缩程度可达到180:1C使用JPGE格式不会对图像产生不可恢复的损失D在备份重要图像时最好不要使用JPGE格式,而应采用TIF等无损的压缩格式用DreamweaverCS3制作网页时插入的图片可以是不在站点下的文件吗?在你之前所做的网页表格中插入图片,并根据表格大小改变图像的大小。制作图片网页,该图片用图像占位符表现制作一个简单的图片网页,网页中有图像在鼠标经过时会切换成另一张图实战演练