美观的网页应该是图文并茂的,在网页中插入图像不但能使网页更加形象和生动,而且还可以使其内容更加丰富多彩。然而,图像的大小会影响网页的下载速度。因此,图像要用得少而精,必要的时候应使用图像处理工具对其进行处理。
一、插入图像
在网页中插入图像的操作步骤如下:
(1)将鼠标指针定位在要插入图像的位置。
(2)单击插入栏的常用类别栏中的“图像”按钮,弹出选择图像源文件对话框。
(3)选中要插入的图像文件,然后单击确定按钮。如果选择的图像文件在本地站点中,图像将被插入到鼠标指针所在的位置;如果选择的图像文件不在本地站点中,将弹出所示的提示框。
(4)单击是按钮,弹出复制文件为对话框,在其中设置插入图像的名称与在本地站点中的保存路径。
(5)单击保存按钮,将图像保存到当前站点中,并且插入到鼠标指针所在的位置。
二、设置图像属性
将图像插入到网页中后,可以在“图像”属性面板中查看并设置图像的大小、对齐、边框等属性。
1.调整图像的大小
将图像插入到网页中后,可以调整其大小,使其适合网页的实际需要。调整图像大小的操作步骤如下:
(1)选中需要调整大小的图像。
(2)在“图像”属性面板的宽、高文本框中输入数值调整图像的大小。此时,在文本框的右侧将出现一个“重置”按钮,单击它将使图像恢复到原始大小。
2.设置图像的对齐属性
用户可以在“图像”属性面板的对齐下拉列表中选择需要的对齐方式,将插入的图像与同一行中的文本、另一个图像、插件或其他对象对齐。
3.为图像设置替代文本
在网页中使用替代文本可以在图像不能正常显示的情况下,提供一个关于图像的文本信息,使用户大致了解图像的内容。设置替代文本的操作步骤如下:
(1)选中要设置替代文本的图像。
(2)在“图像”属性面板的替换文本框中输入替代文本。
(3)按F12键浏览网页,如果图像不能正常显示,则会出现替代文本;如果图像能够正常显示,则当鼠标指针指向图像时会出现文本提示。
4.为图像添加边框
为图像添加边框的操作步骤如下:
(1)选中要添加边框的图像。
(2)在“图像”属性面板的边框文本框中输入图像边框的宽度值。
(3)按F12键,在浏览器中预览效果。
三、编辑图像
在Dreamweaver 8中,用户可以直接对图像进行裁剪、重新取样、锐化或调整其亮度和对比度,该编辑功能仅适用于JPEG和GIF格式的图像。
1.裁剪图像
当在网页中插入的图像不合适时,可以使用Dreamweaver 8提供的裁剪图像功能对其进行裁剪。裁剪图像的操作步骤如下:
(1)选中要裁剪的图像。
(2)单击“图像”属性面板中的“裁剪”按钮,则在该图像的四周出现一个裁剪控制框。
(3)将鼠标指针指向控制点并拖动鼠标,可以改变裁剪框的大小;将鼠标指针移到裁剪框之中并拖动鼠标,可以移动裁剪框的位置。
(4)在裁剪框中双击鼠标,可以剪切掉裁剪框以外的图像。
2.重新取样
在Dreamweaver 8中可以对图像进行重新取样,以提高其下载性能。对图像进行重新取样的操作步骤如下:
(1)选中需要重新取样的图像。
(2)单击“图像”属性面板中的“重新取样”按钮,弹出提示框。
(3)单击确定按钮,图像被重新取样。
3.锐化图像
通过扫描得到的图像,其边缘往往是模糊的,此时,可以对图像进行锐化操作,从而提高图像的质量。锐化图像的操作步骤如下:
(1)选中要锐化的图像。
(2)单击“图像”属性面板中的“锐化”按钮,弹出锐化对话框。
(3)调整的值,值越大,锐化程度就越大。
(4)单击确定按钮,结束锐化操作。
4.调整图像的亮度和对比度
在Dreamweaver 8中可以方便地调整图像的亮度和对比度,操作步骤如下:
(1)选中要调整亮度和对比度的图像。
(2)单击“图像”属性面板中的“亮度和对比度”按钮,在弹出的亮度/对比度对话框中设置图像的亮度和对比度。
(3)单击确定按钮,改变图像的亮度和对比度。