小提示：同网页的背景图像的设置一样，如果此时所选图像不在站点根文件夹中，Dreamweaver会弹出提示框，询问是否将图像复制到站点根文件夹中。单击“是”按钮，系统会自动复制图像文件到站点根文件夹中。否则，在发布网页后，会因找不到图像而无法显示。 步骤 3 选中插入的图像，可利用“属性”面板对该图像的各项属性进行修改。 下面列出图像“属性”面板中各常用项的意义。 ? 图像：设置图像名称，主要用于通过脚本控制图像。 ? 宽和高：图像的宽度和高度（单位为像素），当改变了图像的尺寸后，该数值将加粗显示。 ? 源文件：显示图像文件的路径。 ? 链接：用于创建从图像到其他文件的链接。 ? 替换：在浏览器无法显示图像文件时，在图像位置显示的说明性文字。 ? 垂直边距和水平边距：指定图像上、下、左、右空白的像素值。 ? 目标：设置在何处打开链接文档，_blank 表示新窗口，_self 表示当前窗口，_parent表示当前窗口的父窗口，_top 表示当前窗口的顶级窗口。 ? 边框：设置图像边框的粗细，以像素为单位。有时在为图像设置链接后，图像的周围会多出一个蓝色的边框，此时只需将图像的边框值设置为“0”，即可将该边框去掉。 ? 对齐：确定图像在单元格或页面中的对齐方式。 （三）使用图像占位符 图像占位符相当于图像的临时替代对象。如果网页中的某个图像尚未制作好，可暂时用图像占位符代替。 步骤 1 图像占位符的用法非常简单。确定插入点后，选择“插入记录”→“图像对象”→“图像占位符”菜单，打开“图像占位符”对话框，然后设置其名称、宽度、高度、颜色和替换文本。 步骤 2 单击“确定”按钮，在指定位置插入一个图像占位符。 步骤 3 要用制作好的图像替换图像占位符，可首先单击选择图像占位符，然后在“属性”面板的“源文件”编辑框中输入带路径的文件名，或者单击该编辑框后面的“浏览文件”按钮，在打开的“选择图像源文件”对话框中选择要替换的图像，单击“确定”按钮，Dreamweaver 会自动将图像占位符替换为所选择的图像。 （四）制作鼠标经过图像 在网页中经常可以看到这种情况，当鼠标移动到某一图像上时，图像变成了另一幅图像，而当鼠标移开时，又恢复成原来的图像，这就是通常所说的鼠标经过图像。 要制作鼠标经过图像，需要用到两张大小相同，而内容不同的图像。其中一张作为原始图像，在页面打开的时候显示；另一张则作为鼠标经过图像，在鼠标经过的时候替换原始图像显示出来。以下示例采用了本项目素材中“image”文件夹中的两张图片“EAR_1.jpg”和“EAR_2.jpg”，在开始操作之前，先将这两张图片拷贝到本地站点的图像文件夹中。 步骤 1 在本地站点中新建文档，并重命名为“image.html”。双击打开该文档，在文档窗口中单击定位插入点，然后选择“插入记录”→“图像对象”→“鼠标经过图像”菜单。 步骤2 弹出“插入鼠标经过图像”对话框，在“图像名称”编辑框中为图像输入一个名称（此处为“ear”），然后单击“原始图像”编辑框右侧的“浏览”按钮，弹出“原始图像：”对话框，在“查找范围”下拉列表中选择图像所在文件夹，在文件列表中选择原始图像（此处为 EAR_1.jpg），然后单击“确定”按钮。 步骤 3 按照同样的方法设置“鼠标经过图像”为“EAR_2.jpg”，在“替换文本”编辑框中输入替换文本（此处为“耳钉”），在“按下时，前往的URL”编辑框中输入单击图像时将打开的网页文档名称（或单击编辑框右侧的“浏览”按钮选择网页），最后单击“确定”按钮，插入鼠标经过图像。 步骤 4 按【Ctrl＋S】组合键保存文档，然后按F12键预览网页，将光标放 在设置为鼠标经过图像上方时，可以看到原始图像变为鼠标经过图像。 （五）制作导航条 导航条在网站中起着不可替代的作用，它把网站中的各个页面连接起来。每一个网站都有自己的导航条。利用与制作鼠标经过图像类似的方法，可制作具有可变效果的导航条。制作导航条需要用到两组大小相同而内容不同的图片，本项目素材“image”文件夹中准备了两组图片“dha1～dha6”和“dhb1～dhb6”，在开始操作之前应先将这两组图片拷贝到本地站点的图像文件夹中。 步骤 1 在本地站点中新建文档，保存并重命名为“dh.html”。双击打开该文档，在文档窗口中单击定位插入点，然后选择“插入记录”→“图像对象”→“导航条”菜单。 步骤 2 打开“插入导航条”对话框，在“项目名称”编辑框中输入项目名（此处为“dh1”，也可以不输）；单击“状态图像”编辑框后的“浏览”按钮，在打开的“选择图像源文件”对话框中选择要作为状态图像的文件（此处为“dha1.gif”），然后单击“确定”按钮。 步骤 3 按照同样的方法，设置“鼠标经过图像”为“dhb1.gif”。如有必要，可设置其他选项。 步骤 4 单击编辑框左上方的“添加项”按钮，添加新项。参照前面的方法设置项目名称、状态图像和鼠标经过图像。 “插入导航条”对话框中各主要选项的意义如下： ? 状态图像：表示网页中初始显示的图像。 ? 鼠标经过图像：鼠标滑过时显示的图像。 ? 按下图像：按下按钮时显示的图像，一般不设置。 ? 按下时鼠标经过图像：按钮处于按下状态时的鼠标经过图像，一般不设置。 ? 替换文本：导航图片不能正常显示时，在图片位置显示的文字。 ? 插入：“插入”下拉列表中有两个选项，其中“水平”表示插入水平的导航条，“垂直”表示插入垂直的导航条，默认为“水平”。 步骤 5 重复执行上面的操作，添加并设置新项，最后单击“确定”按钮插入导航条。 步骤 6 按【Ctrl+S】组合键保存文档，然后按F12键预览网页，将光标置于导航条上方时，其背景颜色变深。 小提示：要修改、增加导航条项目，可在选中导航条后，选择“修改”→“导航条”菜单，打开“修改导航条”对话框进行修改。可单击并拖动导航条改变其在网页中的位置；可以复制导航条到别的网页；也可以对导航条附加行为。另外，一个网页中只允许有一个导航条。
相关推荐：
loading