Dreamweaver 入门:向页面中插入图像-Dreamweaver教程

来源: 作者: 更新时间:2006-08-12 点击:

  创建页面布局之后,您就可以将资源添加到页面。您将从添加图像开始。可以在 Dreamweaver 中使用多种方法向 Web 页面添加图像。本文将介绍使用不同的方法将四个不同的图像添加到 Cafe Townsend 的索引页。

  替换图像占位符

  在 Dreamweaver 中创建的index.html 文件。

  双击页面顶部的图像占位符 banner_graphic。

  在\"选择图像源文件\"对话框中,浏览至您定义为站点根文件夹的 cafe_townsend 文件夹中的 images 文件夹。

  选择 banner_graphic.jpg 文件并单击\"确定\"。

  Dreamweaver 将图像占位符替换为 Cafe Townsend 的横幅图形。

  在表格外单击一次以取消选中该图像。

  保存该页(\"文件\">\"保存\")。

  使用\"插入\"菜单插入图像

  在第一个表格的第三行(低于刚插入的横幅图形两行,彩色表格单元格之上)内单击一次。

  选择\"插入\">\"图像\"。

  在\"选择图像源文件\"对话框中,浏览至 cafe_townsend 文件夹中的 images 文件夹,选择 body_main_header.gif 文件,然后单击\"确定\"。 注重假如出现\"图像标签辅助功能属性\"对话框,则单击\"确定\"。

  一个长的彩色图形出现在该表格行中。它看上去更像表格单元格的背景色,而不是图形,但假如仔细看,您将看到该图形具有圆角。添加完所有资源之后,这种圆角效果将使页面的下半部分呈现一种有趣的外观。

  通过拖动插入图像

  在页面上最后一个表格的最后一行(彩色表格单元格之下)中单击一次。

  在\"文件\"面板(\"窗口\">\"文件\")中,找到 body_main_footer.gif 文件(它位于 images 文件夹中),将该文件拖到最后一个表格的插入点。 注重假如出现\"图像标签辅助功能属性\"对话框,则单击\"确定\"。

  在表格外单击一次,并保存该页面(\"文件\">\"保存\")。

  从\"资源\"面板插入图像

  在由三列组成的表格(第一个浅棕色表格单元格)的中间一列内单击一次。

  在\"属性\"检查器(\"窗口\">\"属性\")中,从\"水平\"弹出式菜单中选择\"居中对齐\",然后从\"垂直\"弹出式菜单中选择\"顶端\"。该操作将表格单元格的内容对齐到单元格的中间,并使单元格的内容从单元格顶端开始。

  注重假如您无法看到\"垂直\"或\"水平\"弹出式菜单,请单击\"属性\"检查器右下角的展开箭头。

  按一次 Enter 键 (Windows) 或 Return 键 (Macintosh),创建更多空间。

  单击\"文件\"面板中的\"资源\"选项卡,或选择\"窗口\">\"资源\"。

  则会显示您的站点资源。

  假如未选择\"图像\"视图,则单击\"图像\"以查看您的图像资源。

  在\"资源\"面板中,选择 street_sign.jpg 文件。 关于\"资源\"面板 可以使用\"资源\"面板查看和治理当前站点中的资源。\"资源\"面板显示与文档窗口中的活动文档相关联的站点资源。

  必须首先定义一个本地站点,然后才能在\"资源\"面板中查看资源。

  \"资源\"面板提供两种视图:

  站点列表显示您的站点的所有资源,包括在该站点的所有文档中使用的颜色和 URL。

  收藏列表仅显示您明确选择的资源。若要将某个资源添加到\"收藏\"列表,请在\"站点\"列表中选择该资源,然后从\"文件\"面板右上角的\"选项\"菜单中选择\"添加到收藏夹\"。

  在\"资源\"面板中单击某个资源时,预览区域会显示您所选择的资源。若要更改预览区域的大小,请拖动预览区域与资源列标题之间的分隔线。

  执行下列操作之一:

  将 street_sign.jpg 文件拖到中心位置的表格单元格中的插入点。单击\"资源\"面板底部的\"插入\"。 注重假如出现\"图像标签辅助功能属性\"对话框,则单击\"确定\"。street_sign.jpg 图形即显示在页面上。

< Prev12 Next >
相关Dreamweaver教程:
最新评论:
loading.. 评论加载中....
发表评论:不能超过250字节,请自觉遵守互联网相关政策法规.
  • 昵称: 验证:

最新Dreamweaver教程