网页设计与制作_03超链接插入滚动文字插入图片讲解.pptVIP

第三讲 课 题：超链接插入滚动文字插入图片 目的及要求：熟练掌握页面之间的超链接 教学重点：页面之间的超链接 教学难点：页面之间的超链接 教学课时：2课时 教学方法：提问与比较教学方式，激发学生兴趣； 插入图像 图像文件格式有很多，如BMP、PSD、SVG等，但是网页中通常使用的只有3种，即 GIF、JPEG和PNG。 （1）GIF（Graphics Interchange Format，图形交换格式）格式的特点是压缩比高，磁盘空间占用较少，所以这种图像格式迅速得到了广泛的应用。GIF格式的文件缺点是不能存储超过256色的图像，但是它可以显示动态图像，目前Internet上大量采用的彩色动画文件多为这种格式的文件。 （2）JPEG（Joint Photographic Experts Group，联合图像专家组标准）也是常见的一种图像格式，文件的扩展名为.jpg或.jpeg，采用有损压缩方式，去除冗余的图像和彩色数据，获取极高的压缩率的同时能展现十分丰富生动的图像，可以用最少的磁盘空间得到较好的图像质量。JPEG文件可以包含数百万种颜色，JPEG格式的文件尺寸较小，下载速度快，使得网页有可能以较短的下载时间提供大量美观的图像，成为网络上最受欢迎的图像格式之一。 （3）PNG（Portable Network Graphics，可移植网络图形）是一种替代GIF格式的无专利权限制的格式，它汲取了GIF和JPG二者的优点，能把图像文件压缩到极限以利于网络传输，但又能保留所有与图像品质有关的信息，显示速度很快；PNG的缺点是不支持动画应用效果。 插入图像 插入前景图像 在网页中插入图像，执行以下操作。 （1）在“文档”窗口中，在要插入图像的位置单击鼠标左键，然后执行以下操作之一。 ① 在“插入”工具栏中选择“常用”类别，单击“图像”图标，在弹出的子菜单中选择“图像”选项。 ② 选择菜单选项“插入”→“图像” 。 ③ 选择菜单选项“窗口”→“资源”，打开“资源”检查器，将图像从“资源”检查器拖到“文档”窗口中的所需位置，然后跳到第（3）步。 （2）在弹出的选择图像源文件对话框中选择图片来源。 （3）在随后弹出的图像辅助功能属性对话框中进行设置。 插入图像 插入图像 插入背景图像 插入背景图像即将插入的图像作为网页背景使用，在所插入的背景图片上仍然可以插入前景图片或插入文本，背景图像与背景颜色的用途是类似的。 插入背景图像和插入前景图像的方法不同，若要插入背景图像，操作方法如下。 （1）执行以下操作之一。 ① 在“文档”窗口中单击鼠标左键，打开“属性”检查器，单击“页面属性”按钮。 ② 选择菜单选项“修改”→“页面属性” 。 插入图像 （2）弹出的“页面属性”对话框中，在“分类”中选择“外观”，单击“背景图像”后面的“浏览”按钮，选择所要设置为背景的图片，设定图片“重复”方式， 单击“确定”按钮，插入背景图像。 插入图像 插入图像占位符 图像占位符是一个占据页面位置和空间的空图像块，并不显示真实图像。 设置图像的属性 插入图像后，用户可以根据自己的需要对图像的属性进行设置。图像属性是指图像大小、名称等关于图像的信息。用鼠标单击图像后，图像四周出现可编辑的缩放手柄，说明该图像已被选中，同时“属性”检查器将显示关于图像的属性设置。 设置图像的属性 调整图像大小：宽和高 设置图像对齐方式：水平对齐方式、垂直对齐方式 设置图像间距：垂直边距、水平边距 设置图像链接：整幅图像作为链接（链接属性）、图像热区链接 （地图属性定义热区） 设置低解析度源 ：用于设置图像加载前加载的替代图像 设置图像边框： 编辑图像 裁剪图像 编辑图像 设置图像的亮度和对比度 编辑图像 锐化图像 锐化将增加对象边缘的像素的对比度，从而增加图像清晰度或锐度。 选择要锐化的图像，执行下列操作之一。 ① 单击图像“属性”检查器中的“锐化”按钮。 ② 选择菜单选项“修改”→“图像”→“锐化” 。 （2）弹出的“锐化”对话框，拖动滑块调整锐化参数或直接在文本框中输入相应的数值，单击“确定”按钮保存设置。 使用图像制作特效 为图像添加替换文本 在浏览网页的过程中，由于网速较慢或者图像文件较大，有些图像文件不能很快显示出来，访问者可以通过替换文本了解图片的信息。 使用图像制作特效 创建鼠标经过图像 鼠标经过图像是指当鼠标指针移过时会发生变化的图像。即当鼠标指针经过图像时，它会变成另一幅图像，当鼠标指针离开后，它又变回原来的图像，即网页首次装载时显示的图像。可以在页面中插入鼠标经过图像。鼠标经过图像中的这两个图像应大小相等；如果这两个图像大小不同，Dreamweaver8将自动调整第二个图像的大小，使之与原始图像大小相等。 开始前，请选用一对或多对图像用于鼠标