网页设计实验报告.docVIP

《网站规划与设计》 实验报告 院(系)名称 ： 经济与管理学院 学生姓名 ： 杨坤 学号 ： 专业名称 ： 信息管理与信息系统 班 级 ： 信管1302班 实验1 Dreamweaver 8.0基本操作及简单网页制作实验 1．实验目的与要求 (1)掌握Dreamweaver 8.0基本操作。 (2)掌握本地站点的设置方法。 (3)熟悉制作一个简单网页的过程。 (4)掌握表格的使用方法。 (5)掌握层的基本操作方法。 (6)掌握使用框架布局页面的方法。 2. 试验内容和步骤 1)网页编辑器基本操作 (1)了解Dreamweaver 8.0操作界面上各个部分的主要功能。 了解主菜单、插入面板，属性面板、文档工具条，页面编辑窗口、面板集合的各项功能和操作方法。 (2)了解各种常用快捷键的用法。Ctrl＋S、 Ctrl＋Q、 Ctrl＋Z、 Ctrl＋Y、 Ctrl＋C、Ctrl＋X、Ctrl＋V、Ctrl＋A、F12 2)建立网站的基本操作 (1)打开站点管理器，在本地计算机的当前盘根文件夹中，建立名为mysite的本地站点的根文件夹。 操作步骤如下： ①启动Dreamweaver 8.0，选择【站点】/【管理站点】/【新建站点】命令。 ②在站点定义对话框中，选择【基本】选项卡，在[站点名称]文本框中输入“mysite”。也可在【高级】选项卡中进行设置。 ③单击[下一步]，本次试验学习的是静态站点的定义，选择第一项“否，我不想使用服务器技术”并确认。单击[下一步]，本次试验中的站点文件是复制在本地计算机上的，选择第一项“编辑我的计算机上的本地副本，完成后再上传到服务器”，单击[下一步]，在选择远程服务器的连接方式，选择“无”，即不使用远程服务器连接。单击[下一步]，直至完成。 (2) 在文件夹mysite中新建名为source的子文件夹。把准备好的网页素材文件复制到source文件夹中去。 3)制作简单网页 ①在Dreamweaver 8.0网页编辑器中新建一个页面。选择【保存】，给这个页面取一个名字“index.htm”,保存在站点mysite下。同理创建一个空页面Enter－2.htm。 ②在index.htm页面编辑窗口，输入文字“欢迎光临我的网上书店”等等，选取文字，在属性面板上对文字的大小、字体、颜色等进行设置。保存页面。 ③将光标位于文字下方，在插入面板中找到按钮即可插入图片，也可以直接点击主菜单上的【插入】/【图像】实现插入图片的操作。在文件选择窗口，选择你准备好的source文件夹下的图片。点击图片，在属性面板中显示了图片的各种信息，可以根据需要，对图片的大小进行修改，也可以直接用鼠标通过拉伸改变图像的大小。 ④插入图片以后，还可以为页面设置背景颜色或图片，点击属性面板上的【页面属性】，在对话框中可对背景颜色或背景图片进行设置。 ⑤在页面的右下方输入文字“Enter”，选取文字，为它添加超级链接。在属性面板的“链接”一栏中填写链接的地址，可以是其他某个网站的地址，或者是你网站内的某个文件上（可选取Enter－2.htm），如果希望该页面是在一个新窗口中打开，可以在“目标”中选择“－blank”,新页面在当前浏览器打开选择“－self”。 ⑥这时，一个简单的页面完成了，保存后按F12进行预览。 4)制作表格 (1) 表格的创建、插入、删除、复制和移动等操作 操作步骤如下： ①创建一个名为exe1.htm的网页文件，单击【插入】面板的按钮，在【插入表格】对话框中页面上输入4行5列的表格，在表格中输入如图1—1所示的内容。并在表格上方增加标题“信管专业各班平均成绩表”，标题格式设置为方正舒体、5号、粗体、＃003366。 科目 数据库原理 计算机组成实验 英语精读 电子商务 00级1班 73 85 77 79 01级1班 83 79 82 91 01级3班 90 80 85 92 图1—1 各班平均成绩表 ②在表格“01级3班”前插入一行，内容为“0l级2斑、85、82、88、82”。在表格中“计算机组成实验”列前插人一列，内容为“计算机组成、69、73、75、80”。 ③将00级1班这一行移到表格的最后一行；删除“英语精读”这一行。 (2)单元格的拆分、合并和格式化操作 ①使表格中的数据全部居中，使整个表格在页面上居中。 ②将表格的“计算机组成”和“计算机组成实验”两个单元格合并成一个单元格，内容改为“计算机组成和实验”，设置为居中、黑体、5号。 ③选择【命令】【格式化表格】命令，将表格套用系统预没的格式simple3。 (3)导入外部数据和表格排序 ①在Excel中新建图1－1的表格,保存为value.xls文件。 ②创建