实训1：利用DW建立本地站点

《实训1：利用DW建立本地站点》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、实训1：利用Dreamweaver建立本地站点一、实验目的1、掌握认识并熟悉Dreamweaver的工作界面。2、能够自定义工作环境。3、进行一个简单的网页设计。二、实验内容建立一个以自己名字命名的站点，该站点包含三个文件夹，image，css，mdb，四个网页，分别为index.html，jianjie.html，zuopin.html，xuexi.html，设置主页index.html的标题为“本站主页”。其中index.html页面效果图如下图所示。三、知识点分解本实验主要涉及到如下知识点：在Dreamweaver中建立站点。在Dre

2、amweaver站点文件列表下新建文件和文件夹。在网页中插入背景图片。四、实验步骤1、创建本地站点步骤：打开DREAMWEAVER,选择菜单下[站点]/[管理站点]

3、/[新建]/

4、[站点]命令.弹出如图2-1-2所示对话框。在弹出“站点定义”对话框的“高级”标签中输入如下信息。“站点名称”——输入站点名称如“myweb”。“本地根文件夹”——选择本地文件夹如“Dmyweb”“自动刷新本地文件列表”——选中是否每次拷贝文件到本地站点时都自动更新本地文件夹列表，选中该选项。“默认图像文件夹”——选择图像所放置的文件夹如“‘Dmywebim

5、age”注意：图像文件夹一定要在站点文件夹下，且一般命名为image或images。“HTTP地址”——输入实用的完整网站的URL，以便Dreamweaver能检验使用绝对URL网站链接。“缓存”——选择是否创建一个缓存以提高链接和网站维护任务的速度。选中该选项。设置完毕，点击“确认”按钮。在Dreamweaver的工作界面右侧“浮动面板组”中的“文件”面板中的“文件”标签下就能看到刚才新建的站点myweb，如图所示。如果要对所建立的站点进行修改的话，可以选择菜单下[站点]

6、[管理站点]

7、[编辑]命令。2、在站点文件列表下新建文件和文件夹步

8、骤：(1)在站点文件列表中右键单击“站点—myweb(D:myweb)”，在弹出的菜单中选择“新建文件夹”，文件列表中就会出现名为“新建文件夹”的文件夹，将该文件夹命名为image，同样操作建立css文件夹和mdb文件夹。(2)在站点文件列表下新建文件有2种方法：a)选择[文件]

9、[新建]，在弹出的“新建文档”对话框中，选择“HTML”，就新建了一个HTML网页，然后再选择[文件]

10、[保存]或者是按【Ctrl+S】键，将网页名称改为index.html，同样操作建立jianjie.html,zuopin.html，xuexi.html。b

11、)在站点文件列表中右键单击“站点—myweb(D:myweb)”，在弹出的菜单中选择“新建文件”，文件列表中就会出现名为“新建文件”的网页文件，将该文件命名为index.html，同样操作建立jianjie.html,zuopin.html，xuexi.html。3、在“文件列表”中选中index.html文件，单击右键，在弹出的菜单中选择“设为首页”，回到页面上，在“文档工具栏”中将“标题”更改为“本站主页”。注意：要想在站点文件列表下自动出现新建的文件和文件夹，前提条件必需在建立站点时选中“自动刷新本地文件列表”，否则的话必需单击“刷

12、新”按钮才能出现新建的文件和文件夹，效果图如图所示。4、设计index.html网页步骤：(1)在站点文件列表中双击index.html，打开该网页。(2)将光标定位到“文档工具栏”中的“标题”，将标题中的内容改为“本站主页”，如图所示。(3)单击“属性面板”中的“页面属性”按钮，弹出如图所示的“页面属性”对话框，单击“背景图像”后面的“浏览”按钮，添加背景图像即可。(4)在工作区的“编辑窗口”中输入“欢迎光临我的小站”(5)浏览测试。浏览测试的方法有3种，第1种方法是直接按【F12】键，这是最快捷的方法，建议大家以后尽量采用这种方法。第2

13、种方法是单击如上图所示的“文档工具栏”中的按钮，在弹出的菜单中选择“预览在iexplore”命令后即可在IE浏览器中浏览当前网页。第3种方法是选择[文件]/[在浏览器中预览]/[iexplore]菜单命令即可在IE浏览器中浏览测试当前网页。思考题：在设置网页背景图像时，如果图像太小，铺不满整个网页，怎么办？实训要求按照要求完成各项操作。保存好自己建立的站点和有关网页资料。填写好试验报告。