网页设计制作报告

29）调整刚刚插入层的位置，使之能够更自然的显示！ 30）点击“UntitledFrameset-2.html”，将网页打开，分别将其中的“反回首页”“下 一页”连接至“我的家乡.html”“gaoyuanmingzhu.html”.连接方法，如同上面说说步骤， 不在重复！ 31） 新建一个名为“original images”的文件夹，将“昆明故事”中所用到的图片 全部考入其中，再建立一个名为“xiangce”的文件夹。 32） dreamweaver8 文档窗口下，执行【命令】——【创建网站相册】命令，在打开
的对话框中做如下设置: (1)、在【相册标题】
中输入“80 年代昆明”。在 【副标题信息】中输入“这 些照 片是 Leroy W. Demery, Jr.照 的 ， 时 间 是 1983 年 8 月”。
(2)、点击在【源图像 文件夹】选项后的【浏览】 选择刚刚建立的“original images”文件夹。 （3）、点击在【目标文件夹】选项后的【浏览】选择“xiangce”文件夹。 （4）、点击确定。 33 ） 在 电 子 相 册 页 面 的 左 侧 执 行 插 入 两 个 层 ， 并 在 层 中 插 入 图 像 元 素 “12K963456410-2J100 副本”，并分别输入文字“返回首页”“下一页”，设至文字属性，使 之适合网页大小！ 34）将“返回首页”连接至首页“我的家乡.html”. 将高原明珠的“下一页”连接至“index。htm”“返回首页”连接至“我的家乡.html” 35）保存全部。 36) 建立一个 html 文件名为“xishanlongmen.html” 点击鼠标右键，选择【页面属性】——【背景图像】——【beijin2】（） 37）插入一个两行一列的表格，其属性为：
弹出的列表中选择【上方固定，左侧嵌套】.接下来点击【创建】，在弹出的菜单中选择【确 定】。这样就创建出一个框架集。
14） 在 topframe 插入图片“tu”，操作方式在上边已经介绍过，在这里就不详细说 明了。
15）执行【插入】——【布局对象】——【层】，在 tooframe 中插入一个层，调整层 的位置，使层的位置与网页的位置相适应。
38） 在上边一列表格中插入一个层，在层中输入文字“西山风景”文字属性设置为：
颜色为黑色。 39） 在下面一列表格中建立一个两行三列的表格表格属性为：
40）在刚刚插入的表格的最左侧的两行表格中分别放入一个层，并且分别在层中输入 “睡美人山”、“西山龙门”。具体属性设置如上所说！
41） 在中间两行的表格中分别插入图像元素“睡美人山”“西山龙门”两张图片。 42） 在右侧两行的表格中分别插入一个层，并分别在层中输入文字“从前在昆明西 郊……睡美人"。“龙门石窟位于……不到龙门只是白跑一趟西山"之说”,并分别设置以上两 段文字的文字属性。 43） 在首先插入的表格当中的右下方，插入两个层，并在层中分别输入文字“返回 首页”“下一页”。 44） 将“返回首页”连接至“我的家乡.html”，并将 index.html 的“下一页”连接 至“xishlongm.html”. 45） 执行【文件】——【保存全部】命令，保存网页。 46） 建立一个名为“original images1”文件夹，把这里所需要的图片全部存入 “original images1”中，并接着建立一个名为“xiangce1”的文件夹。 dreamweaver8 文档窗口下，执行【命令】——【创建网站相册】命令，在打开的对话框中 做如下设置:
16）在刚刚插入的层中输入文字，“金马碧鸡坊”，调整文字的字体，字号，位置。具 体方法如上所说。
17）在 leftframe 中点击右键，点击“页面属性”在弹出的对话框中选择背景图像， 点击留恋在弹出的对话框中选择“背景”图像点击确定。操作方法如下图所示：
18) 执行插入“层命令”插入两个层，在层分别输入“返回首页”“下一页” 19） 在 minframe 中插入背景图片“cb75dd08bee7a294d1581b19”操作方式如上说述。 20） 在 minframe 中插入“层”将文字“金马碧鸡坊 1950 年金马碧鸡坊下……促成 了昆明美女文化的必然性。”写入刚刚插入的层中。 21） 保存文件：点击文件【保存全部】保存已经做好的文件。 22） 创建一个“html”页面，文件名为“gaoyuanmingzhu” 23） 在顶部插入一个一行一列的表格，在刚刚插入的表格中插入图像元素“图”，调 整图像的大小和位置。 24） 插入一个层在上一步插入的图像“图”上，并在层中输入文字“高原明珠”，设 置文字的大小和位置。 25） 在刚刚插入的一个一行两列的表格，在左侧一列的表格中插入图片“背景”。 26） 插入两个层，将图像“12K963456410-2J100 副本”插入两个层中，并输入“返 回首页”“下一页”。 27） 在右侧一列表格中，插入名为“高原明珠”的图像元素。 28) 在刚刚插入的图像元素上插入一个层，在层中输入文字“滇池位于昆明市区西 南……滇池是不 收门票的，海埂 公园门票 8 元。” 文字属性 根据以下图片提 示设置：
的图中，放在适当的位置上。（具体步骤如上图所示） 6）在刚刚插入的层中写入“我的家乡”，具体的属性设置如下图所示：
7) 插入导航条：重复第三步，建立一个一行二列的表格，在左侧的表格中执行【插 入】——【图像】命令，插入“图 1”调整图像大小，将图 1 调整到合适的大小。使“图 1” 大小与表格大小相适应。
49） 在页面左侧插入一个层，调节曾的大小，将文字“昆明的高校有： 云南大学本 部 学生城昆明理工大学白龙莲花 学生城 南农业大学 云南师范大学 学生城 本部 云 南民族大学本部 学生城 西南林学院 昆明医学院本部 学生城 云南中医学院 云南 财贸学院 云南警官学院 云南艺术学院 昆明大学 新迎 赵家堆安宁 中医学院 本部 学生城”并设置页面属性！
Dreamweavr8 是一款专业的 HTML 编辑器，用于对 WEB 页和 WEB 应用程序进行设计， 编码和开发。无论直接编写 HTML 代码还是在可视图化编辑环境中工作，dreamweaver8 都会 提供很多快捷的工具。Dreamweaver8 是可以完全自定义的，可以使用它创建自己的对象和 命令，修改快捷键，也可以编写 JAVAScript 代码，从而用自己创建的新行为，属性检查器 和站点报告来扩展 dreamweaver 的功能。
11) 设置超链接将“昆明简介”连接至“我的家乡.html” 设置超链接的方法很多，我采用最简单的：选取文字“昆明简介”然后鼠标点击“连 接文件按钮”拖到“我的家乡.html”放开鼠标。如上图所示。
2) 保 存 文 件。 点 击
【 文 件】——【保存全部 L】。
13）创建框架集：启动 dreamweaver8 界面，点击【从范例创建】——【框架集】在
8)在导航条上插入层，（操作步骤如同上地 5 步）并在层上输入文字，分别为“昆明 简介”“金马碧鸡”“滇池风光”“西山风景”“昆明高校”“购物””外出乘车”“医疗卫生” “城市规划”“昆明故事”。
9) 在右侧的表格中插入图像“翠湖”，然后调整图像“翠湖”的大小，（同上）使图 像的大小与页面相符合。
10) 插入层在图像“翠湖”上，并在其中输入文字“行政区域纵览国家级历史文化名 城昆明是云南省省会，是云南省政治、文化、经济、科技中心及交通和通讯枢纽………革命 遗 址 散 落 在 昆 明 的 大 街 小 巷 。” 其 中 文 字 的 字 体 、 字 号 等 属 性 如 下 图 所 示 ：
三、实验环境及器材 配置适合 dreamweaver 的电脑、dreamweaver 软件、photoshop 软件网页设计有关书 籍。
四、网页制作过程 1、实验操作过程 1） 站点的创建 启动 dreamweaver8 界面，单击【创建新项目】列表栏中的【HTML】超链接。选择【站 点】—【管理站点】—【新建】命令，打开【站点】对话框，在【基本】选项卡中的站点名 称文本框中输入站点名称“我的家乡”。单击【下一步】按扭。选中【否】单选按钮，表示 该站点是一个静态站点，没有动态页。单击【下一步】选择“在本地进行编辑，然后上传到 远程测试服务器”；单击【下一步】从弹出的菜单中选择【无】选项。单击【下一步】，单击 完成。随即出现【管理站点】对话框，显示新站点。单击【完成】。 将所需用到的材料拷入站点文件当中。 2）建立本地站点之后，在文件面板中管理网站文件。 在【文件】面板中 单击鼠标右键，在快捷菜 单中选择【新建文件】，名 称为“我的家乡.html”. 3）.在表格中插入 表格：选择【插入】—【表 格】命令，此时弹出【表 格】对话框，在【行数】 和【列数】中填 1 和 1， 边框粗细填 0，表格宽度 填 1000 像素。单击确定。 4）在表格中插入图 片“我的家乡”：选择【插入】—【图像】命令，在弹出的【选择图像源文件】中选择已存 入【素材】中的图片“我的家乡”，点击【确定】。 5）插入层：点击【插入】—【布局对象】—【层】，单击【层】，将层拖入刚刚插入
50） 将“xishanlongmen.html”中的“下一页”连接至“xiangce1”中的“index” 并将“index”中的“返回首页”连接至“我的家乡.html”.
51) 保存全部
网页制作实验报告
姓名：
刘长禧
班级：
电信 07学号：源自20071042148课程：
网页制作
指导教师：
程满
一、实验目的 1） 掌握 HTML 语法基本的基本用法； 2） 熟悉 HTML 编写网页的方法； 3） 熟悉 dreamweaver8 界面及操作； 4） 熟悉使用 dreamweaver8 建立站点及制作网页； 5） 熟悉 PS 用法； 6） 二、实验基本原理
(1)、在【相册标题】中输入“昆明高校照片”。 (2)、点击在【源图像文件夹】选项后的【浏览】选择刚刚建立的“original images1” 文件夹。 （3）、点击在【目标文件夹】选项后的【浏览】选择“xiangce1”文件夹。 （4）、点击确定，这样就建立出来一个“网络相册”。只要点击上面的图片就可以出 现大图。 47） 点击右键选择【页面属性】——【背景颜色】选项设置为“#99CC33”。 48） 在页面又下角插入两个层，在两个层中分别写入“返回首页”、“下一页”，并设 置文字属性！