
第2章 站点的创建与管理
实训2 卡通世界——创建本地站点
实训目的
1.学会站点的创建与编辑。
2.学会网页文件的新建、保存、预览等基本操作。
实训步骤
1.在D盘根目录中创建文件夹ktsj,将“素材\chapter2”文件夹中的所有文件复制到ktsj中。运行Dreamweaver CS3,选择“站点→新建站点”命令,弹出“站点定义”对话框,选择“基本”选项卡,输入站点名称“卡通世界”,如图2-1所示,单击“下一步”按钮。

图2-1 “站点定义”对话框
2.在“站点定义”对话框的“编辑文件,第2部分”中,询问是否使用服务器技术,选择“否,我不想使用服务器技术”单选按钮,如图2-2所示,单击“下一步”按钮。

图2-2 “站点定义”第二步
3.在“站点定义”对话框的“编辑文件,第3部分”中,选择“编辑我的计算机上的本地副本,完成后再上传到服务器(推荐)”单选按钮,单击“浏览”按钮,在弹出的对话框中选择D:\ktsj文件夹作为站点根目录,如图2-3所示,然后单击“下一步”按钮。

图2-3 指定站点文件夹
4.在“站点定义”对话框的“共享文件”中,询问如何连接到远程服务器,选择“无”,如图2-4所示,单击“下一步”按钮。

图2-4 “共享文件”选项
5.“站点定义”对话框显示“总结”内容,如图2-5所示,单击“完成”按钮,此时,新定义的站点“卡通世界”出现在“文件”面板中,如图2-6所示。

图2-5 “总结”对话框

图2-6 “文件”面板
6.在“文件”面板中选择站点“卡通世界”,单击鼠标右键,在弹出的快捷菜单中选择“新建文件”命令,输入文件名index.html,按【Enter】键完成,如图2-7所示。

图2-7 创建新文件index.html
7.在“文件”面板中选择站点“卡通世界”,单击鼠标右键,在弹出的快捷菜单中选择“新建文件夹”命令,输入文件夹名称images,用来保存图像资源。用同样的方法创建其他3个文件夹artwork、cose、links用于存放不同的栏目内容,“文件”面板如图2-8所示。

图2-8 “文件”面板
8.在“文件”面板中选择index.html文件,单击鼠标右键,在弹出的快捷菜单中选择“设成首页”命令,如图2-9所示,将index.html设置成站点的首页文件。

图2-9 设置首页
9.选择“站点→管理站点”命令,弹出“管理站点”对话框,如图2-10所示,选择站点“卡通世界”,单击“导出”按钮,弹出“导出站点”对话框,选择保存位置为站点根目录,默认的站点定义文件名是“卡通世界.ste”,如图2-11所示,单击“保存”按钮。

图2-10 “管理站点”对话框

图2-11 “导出站点”对话框
10.在“文件”面板中,双击打开index.html文件,选择“文件→导入→Word文档”命令,弹出“导入Word文档”对话框,如图2-12所示,选择D:\ktsj\kt.doc,单击“打开”按钮,即可将Word文档kt.doc导入到index.html网页文件中,如图2-13所示。

图2-12 “导入Word文档”对话框

图2-13 在index.html中导入文档
11.选择“文件→保存”命令,保存文档,按【F12】键打开浏览器预览,如图2-14所示。

图2-14 预览index.html
知识链接