5.3 设置图像属性

在Dreamweaver CC编辑窗口中插入图像之后，选中该图像，就可以在【属性】面板中查看和编辑图像的显示属性。

【操作步骤】

第1步，启动Dreamweaver CC，打开本小节备用练习文档test.html，另存为test1.html。

第2步，将光标设在要插入位置，选择【插入】｜【图像】｜【图像】命令，打开【选择图像源文件】对话框，选择并插入图像images/1.jpg。

第3步，选中插入的图像，在【属性】面板的【ID】文本框中设置图像的ID名称，以方便在JavaScript脚本控制图像。在文本框的上方显示一些文件信息，如图像文件类型，图像大小为147KB。如果插入占位符，则会显示“占位符”字符信息，如图5.11所示。

第4步，插入图像之后如果临时需要更换图像，可以在【Src】文本框中指定新图像的源文件。在文本框中直接输入文件的路径，或者单击【选择文件】按钮，在打开的【选择图像源文件】对话框中找到想要的源文件。

第5步，定义图像显示大小。在【宽】和【高】文本框中设置选定图像的宽度和高度，默认以像素为单位。

第6步，调整图像大小之后，虽然图像显示变小，但图像实际大小并没有发生变化，下载时间保持不变。在Dreamweaver中重新调整图像的大小时，可以对图像进行重新取样，以便根据新尺寸来优化图像品质。

操作方法：单击【重新取样】按钮，重新取样图像，并与原始图像的外观尽可能地匹配。对图像进行重新取样会减小图像文件的大小，但可以提高图像的下载性能，降低带宽，如图5.12所示。

第7步，为图像指定超链接。在【链接】文本框中输入地址，或者单击【选择文件】按钮，在当前站点中浏览并选择一个文档，也可以在文本框中直接输入URL，为图像创建超链接。

此时，【目标】下拉列表框被激活，在这里指定链接页面应该载入的目标框架或窗口，包括_blank、_parent、_self和_top。设置效果如图5.13所示。

第8步，增强图像可用性。在【替换】文本框中指定在图像位置上显示的可选文字。当浏览器无法显示图像时显示这些文字，如“唯美的秋天景色”；在【标题】文本框中输入文本，定义当鼠标移动到图像上面时，会显示的提示性文字，如“高清摄影图片”，设置如图5.14所示。