网页设计实验报告

实验报告 课程名称网络技术基础实验项目TCP/IP协议配置实验仪器计算机 系别 专业 班级/学号 学生姓名 实验日期 成绩 指导教师

实验一 TCP/IP协议配置 一、实验目的（标题黑体小四） 1.熟练掌握模板的用法。 2.掌握CSS的用法。 3.掌握网站发布的方法。 二、实验内容 1. 创建和使用模板。 2. css的创建和使用。 3. 发布网站。 三、实验课时 4课时 四、实验步骤 创建网站 1、创建一个站点，并创建 images 文件夹存放图片。将示例图片拷贝至images 目录下 2、创建 CSS 文件，名称为 style.css，将其保存至 style文件夹。 3、创建模板文件 tpl.dwt，并保存。结果如下： (1) 给 tpl.dwt 附加样式表 style.css。 在 tpl.dwt 的空白处点击鼠标右键，选择“附加样式表”： 选择 style.css 文件： 完成后，在 tpl.dwt 的 head标签里有如下的代码： (2) 设置模板的背景颜色。打开 CSS 面板，为 style.css 新建一条 css 规则。过程如 下：

将背景颜色设为#ff1e70： 在 style.css 生成如下的代码： body { background-color: #ff1e70? } 3) 制作布局。插入一 2 行 2 列的表格。表格的宽度=316+634=950，其他的设置：让表格居中对齐。 (4) 消除表格两边的空隙。展开 CSS 样式表，双击 body： 双击 body后，打开“body的 CSS 规则定义”对话框，按照下面的方式设置：Style.css 的代码变为： body { background-color: #ff1e70? margin: 0px? }

用Dreamweaver建立框架页面

实验8 用Dreamweaver建立框架页面 实验目的：通过实验，掌握如何如何创建和应用框架页面，了解框架的基本分布结构和各个框架页面之间的相互联系。 实验步骤： 1. 启动Dreamweaver程序，选择菜单“文件”“新建”命令，打开“新建文档”对话框。在对话框中“常规”标签下选择“类别”列表中的“框架集”选项，然后再右边的“框架集”列表中选择“上方固定”选项，如图8-1所示。单击“创建”按钮创建框架网页。 2. 选择菜单“窗口”“框架”命令，打开框架控制面板。 3. 用鼠标单击框架控制面板中的下部分，选中mainFrame框架。如图8-2所示： 图8-1 套用框架图11-2 选择框架集的子框架 4. 将鼠标放在选中的边框上，使鼠标变成双向箭头，然后拖动鼠标将该框架分成左右两个子框架。如图8-3所示。

图8-3 把主框架切分为子框架 5. 在框架编辑窗口中，单击顶部框架，选择菜单“文件”→“保存框架”命令，保存框架为页面。 6. 将光标停放到下部分框架的左边框家中，选择菜单“文件”→“保存框架”命令，保存框架为页面。 7. 按同样的方法，将右边的框架保存为页面。 8. 单击框架面板上最外层的边框，或单击页面编辑窗口中的最外层边框，使外框出现虚线。如图8-4所示： 图8-4选中整个框架

说明鼠标单击所选中的框架， 页面中的框架边框会出现虚线，所选 中的框架就是当前正在编辑的页面. 9. 选择菜单“文件”—>“保存 全部”命令，保存所有框架和框架集， 框架集文件名称为.如图8-5所示. 10. 单击框架面板上的topFrame框架，选中网页. 11. 打开属性面板，在属性面板上的“滚动”下拉菜单中选择“否”， 然后勾选旁边的“不能调整大小”复选框；在“边界宽度”和“边界高度”的文本框中都输入0，参数设置如图8-6所示. 图8-6 top框架的属性设置 说明框架属性面板上的“滚动”下拉菜单中有“是”.“否”.“自动”.和“默认”四项，其中选择“是”表示允许页面左右.上下出现滚动条；选择“自动”.“默认”表示根据网页内容，需要时自动显示滚动条；选择“否”表示不允许出现滚动条. 12. 单击top框架页面，在属性面板中单击“页面属性”按钮。 13. 打开“页面属性”对话框，在“左边框.右边框.上边框.下边框”各文本框中输入0，使网页边距都为0.单击“确定”返回框架页编辑窗口. 14. 单击“插入”面板上的“表格”按钮，插入2行4列，宽为100%的表格. 15. 打开属性面板，设置第2列两个表格背景颜色为“浅蓝色”（色标值为#E0E4F4），然后选择第4列单元格，设置同样的背景颜色；设置第3列单元格的背景颜色为“深蓝色”（色标值为#3A4593）

简单网页制作实验总结报告

《大学计算机基础》 实验报告 专业名称: 电子商务2班 学号: xxxxxxxxxxx 姓名: x x 指导教师: x x 2011年12月24日

目录 第一章网站主题设计说明 (1) 1.1 主题内容 (1) 1.2 设计思路 (1) 第二章网站内容设计 (2) 1.1 链接1标题 (2) 1.2 链接2标题 (2) 1.3 flash制作说明 (2) 第三章网站技术难点 (3) 第四章心得体会..................................... ..... ......................... (4)

第一章网站主题设计说明 1.1 主题内容 (1) 网站主题为“四季の花”，包括春夏秋冬四个季节的比较典型的花朵及有关花的诗句，色彩缤纷，十分艳丽夺目。 1.2 设计思路 (2) 大多网站都设计的关于音乐，影视，购物等非常热门的东西，本站设计的主题是花，能让人们在闲下来的时候看看花，品品诗歌，所以做有关花的网页是个不错的选择。同时，让人们分清楚春夏秋冬都各有什么典型的花。

第二章网站内容设计 1.1链接1标题：春の花 春天是生命的季节，在这个季节里，万物复苏。所以就找了虞美人，桃花，牡丹，以及海棠花来作为春天的代表。同时配有与这些花有关的诗句。 1.2 链接2标题：夏の花 夏天充满了激情与阳光，我找了兰花，荷花，百合花等来代表这个季节，色彩艳丽，十分醒目夺人。 1.3 链接3标题：秋の花 大丽花，菊花，月季和牡丹花都竞相出现在本网页，色彩缤纷，赏心悦目。 1.4 链接4标题：冬の花 蝴蝶兰，水仙，迎春花，梅花是冬季的代表，他们刻画了一副傲立冬天的坚强的姿态。

Web网页设计实验报告

WEB系统开发 综合实验报告 题目红尘客栈网上订房页面 专业计算机科学与技术（信息技术及应用） 班级计信2班 学生蒋波涛 重庆交通大学 2013年

目录 一、设计目的 (3) 二、设计题目 (3) 三、结构设计 (3) 四、技术分析 (4) 五、设计过程 (7) 六、实验心得 (10) 七、实验总结 (11)

一、设计目的 在Internet飞速发展的今天，互联网成为人们快速获取、发布和传递信息的重要渠道，它在人们政治、经济、生活等各个方面发挥着重要的作用。因此网站建设在Internet 应用上的地位显而易见，它已成为政府、企事业单位信息化建设中的重要组成部分，从而倍受人们的重视。我们当代大学生更是离不开网络给我们带来的好处与便利.但是,我们成天浏览的网站网页到底是如何制作的呢?我想这一点很多同学都没有去深究过.所以,这学期我选择了”web网页设计”这门课, 本课程的设计目的是通过实践使同学们经历网页制作的全过程. 通过设计达到掌握网页设计、制作的技巧。 了解和熟悉网页设计的基础知识和实现技巧。根据题目的要求，给出网页设计方案，可以按要求，利用合适图文素材设计制作符合要求的网页设计作品。 熟练掌握Photoshop cs3、Dreamweaver cs等软件的的操作和应用。增强动手实践能力，进一步加强自身综合素质。学会和团队配合，逐渐培养做一个完整项目的能力。 二、设计题目 《红尘客栈》 三、结构设计 选定主题，确定题目之后，在做整个网站之前对网站进行需求分析。首先，做好需求调研。调研方式主要是上网查阅资料，在图书馆里翻阅相关书籍。 然后，调研结束之后对整个网站进行功能描述，并对网站进行总体规划，接着逐步细化。 我们选做的主题是个人主页，并且选定题目为“红尘客栈”，其目的是做一个简单的网站，介绍酒店概况，提供一定的资讯信息。 四、技术分析 (一)建立布局 在这次的网页设计中用到大量的布局，所以怎么样建立布局是关键。Dreamweaver cs3是大多数人设计网页的称手兵器，也是众多入门者的捷径。特别是其在布局方面的出色表现，更受青睐。大家都知道，没有表格的帮助，很难组织出一个协调合理的页面。 1.点击“ALT+F6”键，进入布局模式，插入布局表格。建立一个大概的布局。 2.使用背景图片：选中该项，按浏览可以插入一幅准备好的图片作为表格的背景，因为图片是以平铺的形式作为表格背景，所以表格大小和图片尺寸都要控制好。 （二）网页中的图像

网页制作实验报告

网页制作实验报告 页制作实验报告 实验一：站点设置 一、实验目的及要求 本实例是经过“站点定义为”对话框中的“高级”选项卡创建一具新站点。 二、仪器用具 1、生均一台多媒体电脑，组建内部局域，同时接入国际互联。 2、安装windows xp操作系统；建立iis服务器环境，支持asp。 3、安装页三剑客（dreamweaver mx；flash mx；fireworks mx）等页设计软件； 三、实验原理 经过“站点定义为”对话框中的“高级”选项卡创建一具新站点。 四、实验办法与步骤 1）执行“站点＼治理站点”命令，在弹出的“治理站点”对话框中单击“新建”按钮，在弹出的快捷菜单中挑选“站点”命令。 2）在弹出的“站点定义为”对话框中单击“高级”选项卡。 3）在“站点名称”文本框中输入站点名称，在“默认文件夹”文本框中挑选所创建的站点文件夹。在“默认图象文件夹”文本框中挑选存放图象的文件夹，完成后单击“确定”按钮，返回“治理站点”对话框。 4）在“治理站点”对话框中单击“完成”按钮，站点创建完毕。 五、实验结果 六、讨论与结论 实验开始之前要先建立一具根文件夹，在实验的过程中把站点存在自己建的文件夹里，如此才干使实验条理化，别至于在实验后寻别到自己的站点。在实验过程中会浮现一些选项，计算机普通会有默认的挑选，最后别要去更改，假如要更改要先充分了解清晰该选项的含义，以及它会造成的效果，否则会使实验的结果失真。实验前先熟悉好操作软件是做好该实验的关键。 实验二：页面图像设置 一、实验目的及要求： 本实例的目的是设置页面的背景图像,并创建鼠标经过图像。 二、仪器用具 1、生均一台多媒体电脑，组建内部局域，同时接入国际互联。 2、安装windows xp操作系统；建立iis服务器环境，支持asp。 3、安装页三剑客（dreamweaver mx；flash mx；fireworks mx）等页设计软件； 4、安装acdsee、photoshop等图形处理与制作软件； 5、其他一些动画与图形处理或制作软件。 三、实验原理 设置页面的背景图像,并创建鼠标经过图像。 四、实验办法与步骤 1) 在“页面属性”对话框中设置页面的背景图像。 2) 在页面文档中单击“”插入鼠标经过图像。 五、实验结果

网站建设方案_网站框架及制作流程

栏目结构图（品牌形象站与餐吧服务展示站）

公司网站整体风格： 充分体现限公司的特点，以大气、直观、高档、新颖的个性化设计展现公司的品牌形象与主营产品，以求与贵公司网络营销和市场定位达成一致，符合企业形象标准和行业特色，充分展示企业实力和产品特点，展示企业产品营销的风采，能够捕捉客户的需求，双向交流，使客户在网站中充分发表见解，并加以吸收，并从中挖掘潜在的客户，结合行业特色和公司特点，打造一个全新的，符合公司现有发展趋势的网站。 （一）我们的设计宗旨 塑造客户良好的公司知名品牌形象；进行互联网招商引资，扩大销售网络及经 营渠道。 提高宣传力度；完善公司销售管理，增强公司内外部交流。 体现客户的独特风格；最大限度的发挥站点的实用性和美观性。 采用各种先进的数据库以提高公司网站的管理性、灵活性及方便性，并通过网站更好的实现公司信息化与无纸化办公。 首页：设计精美，形式新颖，利用FLASH动感的表达公司的产品内涵。充分体现贵公司的公司实力及品牌形象，大方，得体，不落俗套，给人耳目一新的感觉。. 网站内容包括公司公司介绍、产品展示、网上招聘、新闻动态、下载中心、留言版等栏目，根据贵公司的背景，详尽的介绍贵公司的情况。文字图片相结合形势展现，这样从气势上让人感觉是一个非常有实力的公司。此模块有采用“公司信息系统”完成，前台可实现信息的浏览、查找，后台可方便添加、删除、栏目维护（可添加图片）

网站建设费模块

人才招聘系统实现招聘单位在线发布、修改、删除人才招聘信息，招聘信息和在线注册简历、人才简历对不同服务对象有权限限制。为求职者提供职位人才信息订阅和详细人才信息查询等个性化增值服务。设有一个专门的人才库。 浏览统计分析系统记录网站和公司产品流览量及点击率并分析出每个上网者来源（可分析出IP地址的来访国家、地区、访问页面、停留时间、用的浏览器等） 时间安排： 网站建设进度及实施过程 项目实施方法 我们项目实施方法中的五个基本阶段是：1 规划定义：已完备

网页制作实验报告

北京理工大学珠海学院课程设计说明书 _2013_—_2014_学年第_1_学期 题目: 《Web应用开发课程设计》 学院：计算机学院 专业班级： 11级软件工程3班 学号： 110202031031 学生姓名：蒋征 指导教师：魏志军 成绩： 时间： 2014/1/5 2014年 1 月 5 日

摘要 本次作品是一个IT技术交流论坛，实现论坛的基本功能，注册、登录、发帖、浏览和回帖。 论坛分三个分板块，网页、C#和JA V A，纵向层次也是三层，主页、板块页和帖子页。网站使用JavaScript实现动态页面。 关键词：计算机技术交流社区JavaScript 网页 I

目录 摘要 ............................................. I 目录 ............................................. II 1 网站结构和布局 (1) 1.1 网站结构 (1) 1.1.1 总体结构 (1) 1.1.2 横向链接结构 (2) 1.2 页面布局 (3) 1.2.1 主页 (3) 1.2.2 分版页面 (6) 1.2.3 帖子页面 (6) 2 技术应用 (8) 2.1 逻辑设计 (8) 2.1.1 HTML和CSS设计 (8) 2.1.2 JavaScript设计 (10) 参考文献 (13) 心得体会 (14) I

教师评语 (15) 成绩评定表 (16) 课程设计答辩记录表 (17) II

1 网站结构 1.1主体结构 1.1.1总结构 网站是以技术交流社区为主题的论坛型网站。 这个网站是按树形结构设计如图1-1-1，页面种类共分三层，分别是主页，分主题页还有就是内容页。 主页连向三个分主题分区页面，分别是MTHL板块，C#板块还有就是JAVA 板块。 主题分区页面下面是内容帖子。 图1-1-1网页关系 1

web动态网页设计实验报告

武汉理工大学华夏学院课程设计 课程名称web技术应用基础 题目在线图书销售系统的设计 专业计算机应用 班级计应1091 姓名 学号10210409126 指导教师库少平

利用已经学习的动态网页知识和数据库知识进行一个综合练习。整个设计过程中采用由点到面的方法即根据体系规划及课程系统规划的要求利用各种工具方法制作各子系统的原型系统然后测试分析原型系统最后根据原型系统的风格框架等完成网络考试的全部内容。根据需要利用ASP、SQL SEVER等技术使用数据库完成交互式模块的设计。基本信息管理包括用户管理员义工等对于此类信息提供了添加修改删除查看等四种功能 二、课程设计要求： 需要我们实现的功能有： 1、系统的用户登录及身份验证要求。 a)系统用户注册 b)验证用户的注册信息 c)系统用户进入系统时身份验证 d)系统用户在不同页面浏览时的身份验证 2、在线图书销售系统要求。 a)允许用户浏览所有图书 b)允许用户按图书种类进行查找 c)允许用户购买自己喜欢的图书 d)允许用户对购物车进行管理 e)系统实现订单的处理 f)系统完成整个购物流程 3、图书销售系统的管理子系统要求。 a)对管理员的身份进行验证 b)对数据库中的图书信息进行管理 c)对数据库中的用户信息进行管理 d)对数据库中的订单信息进行管理

3.1需求分析 本系统设计的主要实现网上图书产品的展示与在线定购以及对不同身份的人员包括管理人员，注册用户和普通浏览者进行管理。图书产品展示能分页分类进行显示。系统采用ASP在网络上架构一个网上的书店，通过网上书店可以轻松实现图书信息的查询和采购。 3.2模块设计 3.2.1 SQL数据库的创建 创建一个空数据库，然后编辑数据表的内容在动态网页面中，一般应用这种方式。

网页制作实验报告6个实验

目录 实验一网页设计基础实验 (2) 实验二HTML语言应用 (4) 实验三CSS样式表的应用---CSS的引用 (10) 实验四Dreamweaver的使用、个人网站的制作 (13) 实验五用框架、模板设计网页 (15) 实验六表单制作 (19)

实验一网页设计基础实验 一、实验目的 1．掌握网站设计的基本原则、网站及网页的基本风格与基本构图特点； 2．了解网页布局的形式。 3.用记事本编写一个简单的网页。 二、实验内容 1．上网访问实际若干电子商务网站，了解各网站的风格（主题图形形象、导航是否清晰，整体色调的搭配是否协调，主题是否突出等）。 2．在网上找出下列版面布局的结构形式： ⑴．“T”结构布局 1."T"结构布局。所谓"T"结构。就是指页面顶部为横条网站标志+广告条，下方左面为主菜单，右面显示内容的布局，因为菜单条背景教深，整体效果类似英文字母"T",所以我们称之为"T"形布局。这是网页设计中用的最广返的一种布局方式。这种布局的优点是页面结构清晰，主次分明。是初学者最容易上手的布局方法。缺点是规矩呆板，如果细节色彩上不注意，很容易让人"看之无味"。 2."口"型布局。这是一个象形的说法，就是页面一般上下各有一个广告条，左面是主菜单，右面放友情连接等，中间是主要内容。这种布局的优点是充分利用版面，信息量大(我的主页首页即属于这种布局)。缺点是页面拥挤，不够灵活。也有将四边空出，只用中间的窗口型设计，例如网易壁纸站。 3."三"型布局。这种布局多用于国外站点，国内用的不多。特点是页面上横向两条色块，将页面整体分割为四部分，色块中大多放广告条。 4.对称对比布局。顾名思义，采取左右或者上下对称的布局，一半深色，一半浅色，一般用于设计型站点。优点是视觉冲击力强，缺点是将两部分有机的结合比较困难。 5.POP布局。POP引自广告术语，就是指页面布局象一张宣传海报，以一张精美图片作为页面的设计中心。常用于时尚类站点，比如https://www.doczj.com/doc/9e10999686.html,。优点显而易见：漂亮吸引人 进入internet找到以上各种布局，并写出各种版面布局网站的域名和所采用的版面布局形式 找出使用大色块和抽象线条构图风格的网站（至少各2个）；例：大色块主页 找出10个国内外著名企业或商务网站主页上的宣传标语或体现企业精神的代表性词句。 三、实验步骤与要求 1）新建一个记事本文件本在其中输入如下代码：

Dreamweaver网页制作实训报告

广西科技大学鹿山学院 课程设计报告 课程名称：网页制作课程设计 课题名称：我的梦幻网 指导教师：韦灵 班级：计软141班 姓名：邓康言 学号： 20141409 成绩评定：

指导教师签字： 2015 年 07 月 07 日 目录 一. 网页制作课程设计目的 (3) 二. 1.实训意义： (3) 2.实训目的: (3) 二、课程设计内容 (5) 1.网站主题《我的梦幻网》 (5) 2.网站材料 (5) 3.网站规划 (5) 三、课程设计步骤 (6) 四、网站各模块实现 (7) 1.我的梦幻网模块功能： (7) 2.背景故事模块功能： (8) 3.宠物介绍模块功能： (9) 4.门派介绍模块功能 (10) 5.装备模块功能介绍： (11) 6.人物模块功能介绍： (12)

7.地图介绍模块功能： (14) 7.我的梦幻模块功能： (15) 五、总结及心得体会 (17) 一.网页制作课程设计目的 1.实训意义： 本次网页设计与制作实训是网页教学过程中重要的实践性教学环节.它是根据网页教学计划的要求.在教师的指导下进行网页制作专业技能的训练,培养学生综合运用理论知识分析和解决实际问题的能力,实现由理论知识向操作技能的培养过程.因此加强实践教学环节,搞好实训教学,对实现本专业的培养目标,提高学生的综合素质有着重要的作用. 2.实训目的: 通过综合实训进一步巩固,深化和加强我的理论知识 (1) 掌握规划网站的内容结构,目录结构,链接结构的方法。 (2) 熟练掌握网页制作软件Dreamweaver8和基本操作和使

用。 (3) 掌握页面的整体控制和头部内容设置的方法。 (4) 熟练掌握网页页面布局的各种方法。 (5) 熟练掌握在网页中输入,设置标题和正文文字的方法。 (6) 熟练掌握在网页中插入图像,Flash动画和背景音乐的方法。 (7) 熟练建立各种形式的超级链接的方法。 (8) 掌握表单网页制作方法。 (9) 掌握网页特效制作方法。 (10) 掌握网站测试的方法。 2. 训练和培养我获取信息和处理信息的能力,充分培养和提高动手能力,学会通过网站、书籍、素材等方式收集所需的文字资料、图像资料、Flash动画和网页特效等。 3. 培养我运用所学的理论知识和技能解决网站开发过程中所遇到的实际问题的能力及基本工作素质。 4. 培养我的理论联系实际的工作作风,严肃认真的科学态度以及独立工作的能力,树立自信心。

基于CSS框架的S7-1200Web页面制作

基于CSS框架的S7-1200Web页面制作 S7-1200有个web页面发布的功能，这个功能好像很少有人提及它的使用，我也只是偶尔用来监控一下PLC变量，因为打开TIA14确实有点慢。 但是这个功能绝对不是什么鸡肋，因为它可以发布用户自定义的页面，而且页面可以加载javascript，这就使得它的功能跟火箭一样一飞冲天了，不过官方文档也说了，最好不要靠这个功能来代替专业的HMI软件，毕竟它的实时性和安全性还是有待斟酌的。 但是在产品调试阶段还有测试阶段，这个功能确实很值得一用，因为它很方便实现也很容易让不懂PLC系统的测试人员无门槛上手，毕竟打开浏览器这个操作人人都会。 实现起来很简单，网上的英文文档也很多，介绍的很详细，所以这里就不详细说怎么实现了，只是说一说基于主流的CSS框架来使页面制作的更容易和更美观一些，还有就是在实际编写过程中遇到的一些问题 框架结构 在实际开始进行web功能编写前，需要先规划一下需要展示几个页面和页面的布局，这里介绍一个网站layoutit，这个完全可视化的网站可以进行拖放操作实现网页布局，布局后的html代码可以下载下来直接使用，使用的CSS框架是主流的bootstrap，可以说页面的美观程度完全不用操心，绝对主流，下面是我用它生成的一个网页结

构，之后下载到PLC后，浏览器中打开的样子. 放入变量 网页结构完成后，就可以放入PLC的变量了，这里其实没什么特别要说的，变量是通过在整个html文件开头通过AW P进行所谓的声明，之后在网页中进行使用 从PLC进行读操作的变量通过 从PLC进行写操作的变量通过 这里要注意引号的使用，如果是内存变量M，或者Q，I之类的输入输出变量，就是通过单引号外加双引号将它括起来，像这样 ‘“此处填写变量名”‘ 但是如果是DB块的变量，就需要像这样 ‘“DataBloack名称”.变量名称’ 实际的使用中，无非也就几种操作， 网页端按下按钮控制PLC的变量 在网页端显示PLC的某个变量 网页端输入某个数字到PLC内某个变量

网页设计实验报告 实验一

昆明理工大学信息工程与自动化学院学生实验报告 （201 —201 学年第一学期） 课程名称：Web设计技术开课实验室：年月日年级、专业、班学号姓名成绩 实验项目名称网页设计简介、HTML基础介绍、文字与 段落、列表指导教师 教师 评语教师签名： 年月日 注：报告内容按实验须知中七点要求进行。 一.打开记事本，编写第一个页面。 （1）打开记事本：单击“开始”→“程序”→“附件”→“记事本”。 （2）输入下面代码： 当你进入HTML编程世界的时候，你的
感觉是全新的！ (3)单击“文件”→“选择”→“保存”菜单项，选择文件类型为“所有文件”，文件名输入“index.html”并选择文件保存地址（记住一定要把文件的后缀存为.html或.htm，否则网页无法显示）。 （4）用浏览器打开这个文件，看看效果吧！ 二．用HTML语言编写符合以下要求的文档：标题为“班级主页”，在浏览器窗口用户区显示“欢迎来到我们的班级主页”，完成后效果如图： 代码： 欢迎来到我们的班级主页

网页设计实验报告书_范文

北京信息科技大学网页美术设计实验报告 学院/系人文社科系 学生姓名代俊丽 专业行政管理 学号 2010012299 班级行政1001 实验教师李晋

二Ο一二年 5 月 14 日实验报告

实验报告书 一实验目的 1．学习html语言和dreamweaver等工具 2．掌握在本地环境下运用dreamweaver技术实现一个简单的电子商务网站 二实验的方法和原理 三实验过程 1.资料的搜集。 2.熟悉制作软件。 做网页主要用的工具便是dremweaver、photoshop、flash软件。在这些软件我对dremweaver、photoshop相对比较熟悉，因为在平时上课是老师带领我们运用过。所以我还可以正常的运用，但是出现的问题还是有很多。有很多不懂如何操作，只有通过在次去看书才能够了解，这也体现了我学习方面的缺点，它是我平时不够认真的具体表现。 3.构建站点框架。 打开dremweaver后第一步便是新建站点 4设计主页及二级页面。 5实现网页间的链接 链接的过程其实很简单，主要是把要链接的文字选择在选择工具栏的链接按钮最后选择自己要链接的网页（欢迎访问零二七范文网https://www.doczj.com/doc/9e10999686.html,，零二七范文大全）单击确定便可以了。 6向静态网页插入动态效果 四实验心得 在经济迅速发展的今天，internet显得更为重要它是人们发布信息与传递信息的重要渠道，为了与社会发展同步，为了让我们成为真正的技术性人才。学校在本周为我们安排了维持三周的网页制作专用周是实习，让我们把平时所学知识运用到实习中做到真正的学以致用而不只是纸上谈兵。通过本周的实习使我获得了更多的新知识同时也使我使我认识到了自己在学习上的许多不足。 近三个星期的实训将要结束，其中的酸甜苦辣我会在今后的日子里不断地去咀嚼，去回味，去探索。从制作网页过程中，我学到了新的美化网页的方法，运用了更多以前未运用的技巧。这使我学到了更多的知识，并且为我自己在制作网页这方面积累了一些经验。这些将是我人生中的一次重要的经历，将是我今后走上社会后的一笔巨大的财富。这次实习的收获对我来说有不少，我自己感觉在知识、技能等方面都有了不少的收获。总体来说这次是对我的综合素质的培养，锻炼和提高。

网页制作实验报告详细版

文件编号：GD/FS-4910 （报告范本系列） 网页制作实验报告详细版 The Short-Term Results Report By Individuals Or Institutions At Regular Or Irregular Times, Including Analysis, Synthesis, Innovation, Etc., Will Eventually Achieve Good Planning For The Future. 编辑：_________________ 单位：_________________ 日期：_________________

网页制作实验报告详细版 提示语：本报告文件适合使用于个人或机构组织在定时或不定时情况下进行的近期成果汇报，表达方式以叙述、说明为主，内容包含分析，综合，新意，重点等，最终实现对未来的良好规划。文档所展示内容即为所得，可在下载完成后直接进行编辑。 一、实验目的及要求 本实例是通过“站点定义为”对话框中的“高级”选项卡创建一个新站点。 二、仪器用具 1、生均一台多媒体电脑，组建内部局域网，并且接入国际互联网。 2、安装windowsxp操作系统；建立iis服务器环境，支持asp。 3、安装网页三剑客（dreamweavermx；flashmx；fireworksmx）等网页设计软件； 三、实验原理

通过“站点定义为”对话框中的“高级”选项卡创建一个新站点。 四、实验方法与步骤 1）执行“站点＼管理站点”命令，在弹出的“管理站点”对话框中单击“新建”按钮，在弹出的快捷菜单中选择“站点”命令。 2）在弹出的“站点定义为”对话框中单击“高级”选项卡。 3）在“站点名称”文本框中输入站点名称，在“默认文件夹”文本框中选择所创建的站点文件夹。在“默认图象文件夹”文本框中选择存放图象的文件夹，完成后单击“确定”按钮，返回“管理站点”对话框。 4）在“管理站点”对话框中单击“完成”按钮，站点创建完毕。

网页制作实验报告格式

网页制作实验报告格式 实验一：站点设置 一、实验目的及要求 本实例是通过“站点定义为”对话框中的“高级”选项卡创建一个新站点。 二、仪器用具 1、生均一台多媒体电脑，组建内部局域网，并且接入国际互联网。 2、安装windows xp操作系统;建立iis服务器环境，支持asp。 3、安装网页三剑客(dreamweaver mx;flash mx;fireworks mx)等网页设计软件; 三、实验原理 通过“站点定义为”对话框中的“高级”选项卡创建一个新站点。 四、实验方法与步骤 1)执行“站点管理站点”命令，在弹出的“管理站点”

对话框中单击“新建”按钮，在弹出的快捷菜单中选择“站点”命令。 2)在弹出的“站点定义为”对话框中单击“高级”选项卡。 3)在“站点名称”文本框中输入站点名称，在“默认文件夹”文本框中选择所创建的站点文件夹。在“默认图象文件夹”文本框中选择存放图象的文件夹，完成后单击“确定”按钮，“管理站点”对话框。 4)在“管理站点”对话框中单击“完成”按钮，站点创建完毕。 五、实验结果 六、讨论与结论 实验开始之前要先建立一个根文件夹，在实验的过程中把站点存在自己建的文件夹里，这样才能使实验条理化，不至于在实验后找不到自己的站点。在实验过程中会出现一些选项，计算机一般会有默认的选择，最后不要去更改，如果要更改要先充分了解清楚该选项的含义，以及它会造成的效果，否则会使实验的结果失真。实验前先熟悉好操作软件是做好该实验的关键。 实验二：页面图像设置

一、实验目的及要求： 本实例的目的是设置页面的背景图像,并创建鼠标经过图像。 二、仪器用具 1、生均一台多媒体电脑，组建内部局域网，并且接入国际互联网。 2、安装windows xp操作系统;建立iis服务器环境，支持asp。 3、安装网页三剑客(dreamweaver mx;flash mx;fireworks mx)等网页设计软件; 4、安装acdsee、photoshop等图形处理与制作软件; 5、其他一些动画与图形处理或制作软件。 三、实验原理 设置页面的背景图像,并创建鼠标经过图像。 四、实验方法与步骤 1) 在“页面属性”对话框中设置页面的背景图像。 2) 在页面文档中单击“”插入鼠标经过图像。 五、实验结果

Web网站设计实验报告

Web网站设计实验报告 学生： 学号： 班级： 系别： 学院：

目录 一、设计目的 (3) 二、设计题目 (3) 三、结构设计 (3) 四、技术分析 (5)

五、设计过程 (6) 六、实验总结 (7) [附录]网页源代码节选 (8) 一．设计目的 在Internet飞速发展的今天，互联网成为人们快速获取、发布和传递信息的重要渠道，它在人们政治、经济、生活等各个方面发挥着重要的作用。因此网站建设在Internet应用上的地位显而易见，它已成为政府、企事业单位信息化建设中的重要组成部分，从而倍受人们的重视。我们当代大学生更是离不开网络给我们带来的好处与便利。但是,我们成天浏览的网站网页到底是如何制作的呢我想这一点很多同学都没有去深究过。所以为了了解网页制作的过程，我们在老师的指导下分前台和后台进行了一系列操作，并有所收获。 我们了解和熟悉了网页设计的基础知识和实现技巧，也熟练掌握

了Photoshop cs3、Dreamweaver cs等软件的的操作和应用。 二．设计题目 《篮球球迷交流网》 主要是篮球新闻、视频，还有交流帖子区，交易广告平台等。三．结构设计 选定主题，确定题目之后，网站设计还是一张白纸，我所做的是需要在这张白纸上一点点勾勒出网站的大框架，然后慢慢填充，实现网站的构想。首先我们在网上和图书管里查阅了大量的资料，以确定我们所需要的基本技术。然后，我们对整个网站进行总体规划，接着逐步细化。 我的设计主题是篮球球迷交流网，包括多个方面，框架为：首先是首页，首页下是新闻头条，分栏有球迷自述、篮球美图、给我留言，从分栏都可以回到首页。 首页主要分为新闻头条、热门话题区、靓图展示。 此为网站的大体板块，下面我们就每一页的页面板块进行详细的分析，有了大体框架，我们只需要在每一页的主要内容上做以划分，

网页制作实验报告

网页制作实验报告 1、网站的主题说明 我的个人网站的主题是旅游，主要介绍的是日本。在我的网站中，有关于日本的景点、美食和购物的简介，提供一定的资讯信息，还有旅游的小贴士和留言板，能够与访问者互动，分享关于日本旅游的最新讯息。 2．网站的总体规划与网站的结构框图 日本的国名含义为“日出之国”。全国由北海道、四国、本洲和九洲四个大岛及几千个小岛组成，海岸线漫长曲折，境内山地崎岖、河谷交错，景色优美壮丽。 粉色樱花雨，绚烂如火的红叶，遍布岛国的绿色森林，还有漫长的美丽海岸线，都有着精致的柔美；火山地震众多，则令这些柔美脆弱而珍贵。日本前卫时尚，是匪夷所思的创意科技之国，却也是将传统文化固守得最好的国度：神社寺院的古老建筑动辄几百年历史，茶道、庭园、手工艺传承着和风之美，日式的贴心服务和国民的知书识礼，同样令人慨叹。 从东京到京都，从北海道到冲绳，每个地方都有着独特的人情风土，值得一去再去。享受美景、美食，疯狂血拼，更别忘了参加传统祭典、泡露天温泉。 因此我将网站的主题定位在甜美梦幻的风格上，附上日本经典的樱花和建筑，将日本的魅力展现在浏览者的面前。各个页面都有导航条设计、使浏览者在任意页面均可到达他想到达的景点介绍页面，增强了页面的友好程度。 网站的结构框图 3．网站LOGO 说明与各级网页风格说明 我的logo 是由图片和文字组成，可爱的小汽车表达了旅行的意愿，符合网站旅游的主题，颜色搭配也与网页的背景图片相符。为了统一便于浏览，所有的网页我采用统一的背景图片，配上简单的图片和文字，使页面简洁明了 首页

景点 美食 留言板

4．典型网页的设计过程与样例 ⑴创建站点。点击“站点”下拉菜单的“创建站点”，名字站点名称和站点在计算机的路径。 ⑵点击“文件”下拉菜单的“新建”，创建基本页面，在打开的页面中设置背景图片。 ⑶表格是非常重要的布局工具，例如首页，点击菜单栏的“插入”和“表格”，创建一个4行1列的表格，根据需要调整大小，在表格的第二行插入一个1行6列的表格作为导航，在其他表格中插入“简介”和图片。 ⑷将“首页”“景点”“美食”“购物”“旅游小贴士”“留言板”等文字键入表格后，为其设置超链接，选定文字后，在下面的属性栏中点击“链接”的文件浏览，找到相应的网页后完成超链接。 ⑸用以上的基本操作完成其他网页，并一一为导航文字设置超链接，在建设留言板的网页时，最重要的是文本域的插入，具体操作如下：插入→表单→文本域，将其放在你想设置的位置，在旁边插入按钮，插入→表单→按钮，设置“提交”和“重置”完成留言板的主体部分，插入一些图片进行美化。 ⑹最后点击浏览器进行预览和调制，F12是预览的快捷方式，完善后完成网站建设。5．提出对网站的改进意见 做好页面，并不是一件容易的事，它包括个人主页的选题、内容采集整理、图片的处理、页面的排版设置、背景及其整套网页的色调等很多东西。本次网站设计不是很好，页面过于简单，创新意识方面薄弱，链接方面只有二级页面，内容不够丰富，这是我需要提高的地方。需要学的地方还有很多，需要有耐心、坚持，不断的学习，综合运用多种知识，才能设计出好的web页面。

网页制作实验报告格式

网页制作实验报告格式 sp; 实验一：站点设置 一、实验目的及要求 本实例是通过"站点定义为"对话框中的"高级"选项卡创建一个新站点。 二、仪器用具 1、生均一台多媒体电脑，组建内部局域网，并且接入国际互联网。 2、安装windowsxp操作系统;建立iis服务器环境，支持asp。 3、安装网页三剑客(dreamweavermx;flashmx;fireworksmx)等网页设计软件; 三、实验原理 通过"站点定义为"对话框中的"高级"选项卡创建一个新站点。 四、实验方法与步骤 1)执行"站点管理站点"命令，在弹出的"管理站点"对话框中单击"新建"按钮，在弹出的快捷菜单中选择"站点"命令。 2)在弹出的"站点定义为"对话框中单击"高级"选项卡。 3)在"站点名称"文本框中输入站点名称，在"默认文件夹"文本框中选择所创建的站点文件夹。在"默认图象文件夹"文本框中选择存放图象的文件夹，完成后单击"确定"按钮，返回"管理站点"对话框。 4)在"管理站点"对话框中单击"完成"按钮，站点创建完毕。 五、实验结果

六、讨论与结论 实验开始之前要先建立一个根文件夹，在实验的过程中把站点存在自己建的文件夹里，这样才能使实验条理化，不至于在实验后找不到自己的站点。在实验过程中会出现一些选项，计算机一般会有默认的选择，最后不要去更改，如果要更改要先充分了解清楚该选项的含义，以及它会造成的效果，否则会使实验的结果失真。实验前先熟悉好操作软件是做好该实验的关键。 实验二：页面图像设置 一、实验目的及要求： 本实例的目的是设置页面的背景图像,并创建鼠标经过图像。 二、仪器用具 1、生均一台多媒体电脑，组建内部局域网，并且接入国际互联网。 2、安装windowsxp操作系统;建立iis服务器环境，支持asp。 3、安装网页三剑客(dreamweavermx;flashmx;fireworksmx)等网页设计软件; 4、安装acdsee、photoshop等图形处理与制作软件; 5、其他一些动画与图形处理或制作软件。 三、实验原理 设置页面的背景图像,并创建鼠标经过图像。 四、实验方法与步骤 1)在"页面属性"对话框中设置页面的背景图像。 2)在页面文档中单击""插入鼠标经过图像。