Dreamweavercs4网站制作入门..docVIP

Dreamweaver cs4 网站制作入门 网站制作实例一：??Cafe TownsendCafe Townsend一、创建工作目录工作目录就是你建立站点时所要使用的本地文件夹，Dreamweaver 将此文件夹称为本地站点。本地文件夹通常是你的计算机硬盘上的一个文件夹，例如：D:\mywebsites 。1、在 D：盘上创建名为 mywebsites 的新文件夹。2、下载所需素材。cafe_townsend.rar3、将下载得到的素材解压缩到 mywebsites 文件夹中。 你将使用 D:\mywebsites\cafe_townsend 文件夹作为站点“cafe townsend” 的根文件夹（主文件夹）。 二、定义本地文件夹您必须为创建的每一个新 Web 站点定义 Dreamweaver 本地文件夹。本地文件夹是您在硬盘上用来存储站点文件的工作副本的文件夹。如果不定义本地文件夹，Dreamweaver 中的某些功能可能无法正确运行。如果定义了本地文件夹，您还可以管理文件，并使用一些文件传输方法在本地与 Web 服务器之间传输文件。1、启动 Dreamweaver，选择“站点 ”“管理站点”。 2、在弹出的“管理站点”对话框中单击“新建”按钮，然后选择“站点”。3、在弹出的“站点定义”对话框中，如果显示向导（“基本”选项卡），则单击“高级”选项卡，然后从“分类”列表中选择“本地信息”（它应当是默认选项）。 4、在“站点名称”文本框中，输入 Cafe Townsend 作为站点名称。 5、在“本地根文件夹”文本框中，指定在上一节中复制到 D:\mywebsite 文件夹中的 cafe_townsend 文件夹。你可以单击文件夹图标来浏览并选择该文件夹，或者在“本地根文件夹”文本框中输入路径。 6、在“默认图像文件夹”文本框中，指定 cafe_townsend 文件夹中已有的 images 文件夹。你可以单击文件夹图标来浏览并选择该文件夹，或者在“默认图像文件夹”文本框中输入路径。7、单击“确定”。随即出现“管理站点”对话框，显示您的新站点。 8、单击“完成”关闭“管理站点”对话框。此时“文件”面板显示当前站点的新本地根文件夹。“文件”面板中的文件列表将充当文件管理器，允许您复制、粘贴、删除、移动和打开文件，就象在计算机桌面上一样。现在，已经为您的站点定义了一个本地根文件夹。本地根文件夹是本地计算机上用来存储 Web 页面的工作副本的文件夹。如果您以后想要发布页面并使其可供公众访问，则需要在运行 Web 服务器的远程计算机上定义一个远程文件夹，用来存储本地文件的已发布副本。三、了解你的任务下图是一张为 Cafe Townsend（一个需要制作 Web 站点的虚构餐馆）设计的、完整的和符合要求的设计草样。作为 Web 设计人员，您需要对草样进行转换，使之最终形成可以使用的 Web 页面。 创建基于表格的页面布局 表格是用于在 HTML 页上显示表格式数据以及对文本和图形进行布局的强有力的工具。你可以使用表格快速轻松地创建布局。在本实例中，你将在一个新的 Dreamweaver 文档中创建若干表格。这些表格的行和单元格实际上将用作你将在以后添加的内容的“容器框”。一、创建并保存新页面 建立站点并检查设计草样后，你就可以开始创建 Web 页面了。首先你将创建一个新页面，并将它保存到你的 Web 站点的本地根文件夹 cafe_townsend 中。该页面最终将成为虚构餐馆 Cafe Townsend 的主页。1、在 Dreamweaver 中，选择“文件”“新建”。 2、在“新建文档”对话框的“常规”选项卡上，从“类别”列表中选择“基本页”，从“基本页”列表中选择“HTML”，然后单击“创建”。 3、选择“文件”“另存为”。 4、在“另存为”对话框中，浏览至定义为站点的本地根文件夹的 cafe_townsend 文件夹并打开该文件夹。 5、在“文件名”文本框中输入 index.html，然后单击“保存”。 文件名即出现在应用程序窗口顶部的标题栏中。 6、在新文档顶部的“文档标题”文本框中，键入 Cafe Townsend。这就是页面的标题。站点访问者在 Web 浏览器中查看页面时将在浏览器窗口的标题栏中看到此标题。 7、选择“文件”“保存”来保存该页面。 二、插入表格：接下来，您将添加一个表格，用于放置文本、图形和 Macromedia Flash 资源。1、在页面上单击一次，在页面左上角放置插入点。 2、选择“插入”“表格”。 3、在“插入表格”对话框中，执行下面的操作：