第9章Dreamweaver8基礎实验.docVIP

第9章 Dreamweaver8.0基础实验 实验一 在Dreamweaver8.0中建立一个站点 一、实验目的 1、掌握Dreamweaver8的操作界面。 2、掌握站点创建的方法。 3、能够自定义工作环境。 4、进行一个简单的网页设计。 二、实验内容 建立一个以自己名字命名的站点，该站点包含三个文件夹，images，music，flash，四个网页，分别为index.html，word.html，table.html，picture.html，设置主页index.html的标题为“本站主页”。其中index.html页面效果图如9-1-1所示。 图9-1-1 index.html页面效果图 图9-1-2 “站点定义”对话框 (3) “站点名称”——输入站点名称如“myweb”。 (4) “本地根文件夹”——选择本地文件夹如“D\myweb” (5) “自动刷新本地文件列表”——选中是否每次拷贝文件到本地站点时都自动更新本地文件夹列表，选中该选项。 (6) “默认图像文件夹”——选择图像所放置的文件夹如“‘D\myweb\images” 注意：图像文件夹一定要在站点文件夹下，且一般命名为image或images。 (7) “HTTP地址”——输入实用的完整网站的URL，以便Dreamweaver能检验使用绝对URL网站链接。 (8) “缓存”——选择是否创建一个缓存以提高链接和网站维护任务的速度。选中该选项。 (9) 设置完毕，点击“确认”按钮。 (10) 在Dreamweaver的工作界面右侧“浮动面板组”中的“文件”面板中的“文件”标签下就能看到刚才新建的站点myweb，如图9-1-3所示。 图9-1-3 新建站点myweb 如果要对所建立的站点进行修改的话，可以选择菜单下[站点]|[管理站点]| [编辑]命令。 2、在站点文件列表下新建文件和文件夹步骤： (1)在站点文件列表中右键单击“站点—myweb(D:\myweb)”，在弹出的菜单中选择“新建文件夹”，文件列表中就会出现名为“新建文件夹”的文件夹，将该文件夹命名为images，同样操作建立music文件夹和flash文件夹。 (2) 在站点文件列表下新建文件,选择[文件]|[新建]，在弹出的“新建文档”对话框中，选择“HTML”，就新建了一个HTML网页，然后再选择[文件]|[保存]或者是按【Ctrl+S】键，将网页名称改为index.html，同样操作建立word.html, table.html，picture.html。 单击“刷新 ”按钮就能出现新建的文件和文件夹，效果图如图9-1-4所示。 图9-1-4 新建文件和文件夹效果图 4、设计index.html网页步骤： (1)在站点文件列表中双击index.html，打开该网页。 (2)将光标定位到“文档工具栏”中的“标题”，将标题中的内容改为“本站主页”，如图9-1-5所示。 图9-1-5文档工具栏 (3)单击“属性面板”中的“页面属性”按钮，弹出如图9-1-6所示的“页面属性”对话框，单击“背景图像”后面的“浏览”按钮，添加背景图像即可。 (4)在工作区的“编辑窗口”中输入“欢迎光临我的小站” 图9-1-6 “页面属性”对话框 (5)浏览测试。按【F12】预览。 实验二　制作网页设置格式的方法 　1、启动Dreamweaver 1）点击“开始－所有程序－Macromedia－Macromedia Dreamweaver 8”，。 2）上次建的站点.html，打开该网页。3）把标题改为“青青草主页”，输入下面内容，输完一行后按一下回车键(也可以写自己的内容)，输完保存一下文件。 　 ）下面设置文字格式，拖黑选中标题“青青草”，在下面的侧边栏，属性面板中找第二排的各个按钮，依次是字体、大小、颜色。 ）按从左到右的顺序，把字体设为“黑体”、大小设成“24”、颜色设为绿色，标题一般要醒目些。 ）再拖黑选中下面的三行内容，在下面的属性面板中，把字体设为“新宋体”、大小为“18”、颜色为蓝色 图9-2-2 文字格式设置效果图 7）如果字体太少可以点列表下边的“编辑字体列表..”，添加其他字体， 先在右边的列表中找到字体，再点中间的 按钮添加到左边，然后点上边的加号按钮，即可添加字体。 “编辑字体列表”）设好以后，在属性面板的第一排，“样式”旁边会出来一个STYLE2，这是自动保存了字体、字号、颜色的样式表，下次可以直接用，不用再一个一个设了。 属性面板在颜色按钮的旁边，有一串颜色代码，用数字代表颜色，以井号#开头的6个数字。对齐1）输下面的三行内容，输完一行后，按一下回车键。 　2）拖黑选中三行内容，在下边属性面板第一排中，找到“居中”按钮点一下， 属性面