Dreamweaver第一次课学案.doc

Dreamwever课的学案 一、定义站点 创建站点 单击菜单栏中的【站点】\【新建站点】命令。 （1）单击菜单栏中的【站点】\【新建站点】命令，弹出“站点定义”对话框，在弹出的对话框中输入站点的名字，在第二个号文本框中，会出现站点储存的默认位置，或者在下面的文本框中指定一个存储位置，Dreamweaver将在其中存储站点文件。　　 （2）单击保存按钮，则通过向导建立了一个本地站点。 2．添加网页文件与站点文件夹 新建的站点是空白的，其中没有任何内容。根据站点的规划，需要向其中添加网页文件或站点文件夹。网页文件即上网时浏览的HTML文件；站点文件夹则用于管理站点内容，因为站点中会有很多文件，为了有效地管理文件，可以将它们分门别类地存放在文件夹中，如图像文件夹可以专门用于存放图像、动画等。在站点中添加网页文件与文件夹的方法基本一致，操作步骤如下： ①在【文件】面板中，右键单击“站点”根目录，则弹出一个快捷菜单。②选择快捷菜单中的【新建文件】命令，则新建了一个网页文件。 ③同样的方法，如果在弹出的快捷菜单中选择【新建文件夹】命令，则可以在站点中添加一个文件夹。 创建和保存网页 1.创建新文档 （1）创建空文档。【文件】/【新建】，打开【新建文档】对话框。在【空白页】类别中从【页面类型】列表选择【HTML】，【布局】中选择【无】，即可创建一个纯HTML空白页。 （2）创建应用CSS布局的文档。选择【文件】/【新建】，在【新建文档】对话框的【空白页】选项卡中从【页面类型】列表选择要创建的页面类型。如果从【布局】列表中选择一个预设的CSS布局，将创建一个包含预设CSS布局的页面。从【页面类型】列表中选择【HTML】、【HTML模板】等，右侧的【布局】列表中显示相应的文档布局类型。 预设的CSS布局类型有： ①固定：列的大小不会根据浏览器的大小或站点访问者的文本设置来调整。 ②弹性：列宽是以相对于文本大小来决定的。如果访问者更改了文本设置，该列的宽带将会进行调整，但不会基于浏览器窗口的大小来更改列宽度。 ③液态：列宽是以站点访问者的浏览器宽度的百分比来决定的。如果站点访问者将浏览器变宽或变窄，该列的宽度将会进行调整，但不会基于站点访问者的文本设置来更改列宽度。 ④混合：用上述3个选项的任意组合来决定列类型。如，两列混合，左侧栏布局具有可缩放至浏览器大小的液态主列，而右侧的弹性列可缩放至站点访问者的文本设置的大小。 【文档类型】弹出菜单中选择文档类型，一般情况下使用默认选项【XHTML 1.0 Transitional】。 如果在【布局】列表中选择了一种CSS布局，则从【布局CSS位置】弹出菜单中为布局的CSS代码选择一个位置。 ①添加到文档头：将布局的CSS代码添加到要创建的页面头中。 ②新建文件：将布局的CSS代码添加到新的外部CSS文件，并将新的样式表附加到要创建的页面中。 ③链接到现有文件：指定当前页面使用的现有CSS文件。单击【附加CSS文件】窗格上方的【附加样式表】图标并选择一个现有的CSS样式文件。 2.保存网页 如果网页编辑完成或已经告一段落，需要保存，根据不同的需要，保存的方法也不同。 打开【文件】菜单，要保存当前文档选择“保存”命令； 如果当前文档已经保存过，可选择“另存为”命令； 如果在编辑时已经打开了多个文档，希望将所有的文档进行保存，则选择“保存全部”命令。 三、设置页面属性 设置背景属性 操作步骤： ①单击修改→页面属性命令菜单，打开“页面属性”对话框。单击背景下拉列表框，在弹出的色盘中，用吸管吸取一个颜色。 ②在“页面属性”对话框中，单击“应用”按钮，此时，对话框不会消失，可以看到“编辑区”的背景颜色发生改变，页面背景颜色设置完毕。 ③设置背景图像。在“页面属性”对话框中，在“背景图像”文本框中输入图像的地址或单击“浏览”按钮，在本地硬盘浏览选择要插入的图片，单击确定按钮。 ④然后单击应用按钮，可以看到图像自动平铺铺满整个网页。 2.设置文字属性 操作步骤： ①在“页面属性”对话框中，在“文本颜色”框中选择网页普通文本的颜色，在“链接颜色”框、“已访问链接”框中设置不同的颜色。 设置页面边距 “左边距”、“右边距”两个属性是针对IE浏览器，用于设置整个页面距离浏览器左侧边缘的宽度以及整个页面距离浏览器顶部边缘的高度，以像素为单位。 操作步骤： 在“页面属性”对话框中，输入像素值，单击确定即可。 文本 1.文本的输入 可以在文档窗口中直接键入文本，也可以复制、剪切并粘贴文本，还可以从其他文档导入文本。如果要将其他文本格式粘贴到DW中，可以使用【粘贴】或【选择性粘贴】命令。 【选择性粘贴】允许用户以不同的方式指定所粘贴文本的格式。如将文本从带格式的Word文档粘贴到DW文档中时，如果想