实验5-Dreamweaver网页制作与设计(一)创建网站-第13周共27页文档

合集下载

dreamweaver网页设计实验指导书

dreamweaver网页设计实验指导书

网页设计实验指导书(一)DreamWeaver静态网页制作第一章网站规划 ................................................................................................... - 3 - 第二章Dreamweaver静态网页设计实验 ...................................................... - 8 - 实验一在Dreamweaver中建立一个站点.................................................. - 8 - 实验二在网页中使用文本........................................................................... - 15 - 实验三超级链接的建立............................................................................... - 21 - 实验四网页图像的应用............................................................................... - 29 - 实验五网页表格操作 ..................................................................................... - 36 - 实验六利用表格进行网页布局..................................................................... - 39 - 实验七利用层进行网页布局....................................................................... - 48 - 实验八行为和图层的应用............................................................................. - 53 -实验九框架型网页的制作........................................................................... - 66 - 实验十一交互式表单的应用..................................................................... - 84 - 实验十二HTML语言基础应用 .................................................................... - 90 - 实验十三网页动态效果辑............................................................................. - 97 - 实验十四CSS样式表的创建及运用....................................................... - 106 -第一章网站规划一、网站建设的基本流程网站建设的基本流程是:网站规划,网页设计,网上安家以及网站维护与管理,如图1-1所示。

实验五网页的简单制作PPT参考课件

实验五网页的简单制作PPT参考课件
• 在“布局”模式中,您可以使用表格作为基础结构来设计您的 页,同时避免使用传统的方法创建基于表格的设计时经常出现 的一些问题。局。
• 关于“布局”模式 • 从“标准”模式切换到“布局”模式 • 在“布局”模式中绘制 • 将内容添加到布局单元格中 • 清除自动设置的单元格高度 • 调整布局单元格和表格的大小以及移动它们 • 设置布局单元格和表格的格式 • 设置列宽度
设置模板首选参数。 • 您可以在模板的“设计备注”文件中存储关于模板的附加信息(如创作者、
最后一次更改的时间或作出某些布局决定的原因)(基于模板的文档不继承 模板的设计备注。 • 若要创建模板,请执行以下操作: • 打开要另存为模板的文档: • 若要打开一个现有文档,请选择“文件”>“打开”,然后选择该文档。 • 若要打开一个新的空文档,请选择“文件”>“新建”。在出现的对话框中, 选择“基本页”或“动态页”,选择要使用的页面类型,然后单击“创建”。 • 文档打开时,执行下列操作之一: • 选择“文件”>“另存为模板”。 • 在“插入”栏的“常用”类别中,单击“模板”按钮上的箭头,然后选择 “创建模板”。 • 除非您以前选择了“不再显示此对话框”,否则您将收到一个警告,表示您 正在保存的文档中没有可编辑区域。单击“确定”将文档另存为模板,或单 击“取消”退出此对话框而不创建模板。 • 出现“另存为模板”对话框。
– 设置好 Dreamweaver 站点后,最好将该站点导出,以便拥有一个本地备份副本。有关 更多信息,请参见导入和导出站点。
• 设置本地文件夹 • 本地文件夹是 Dreamweaver 站点的工作目录。此文件夹可以位
于本地计算机上,也可以位于网络服务器上。
• 若要设置本地文件夹,请执行以下操作: • 选择“站点”>“管理站点”。 出现“管理站点”对话框。 • 注意 • 如果您没有定义任何 Dreamweaver 站点,则会出现“站点定义”

Dreamweaver网页设计_实训报告

Dreamweaver网页设计_实训报告

广播电视大学实训报告书一姓名学号专业/班级14秋计算机信息管理课程名称Dreamweaver网页设计教材网页设计与制作――Macromedia Dreamweaver 8任务编号01 任务名称使用Dreamweaver建立网站,建立一个名为“wywed”的网站思考题1、通过站点设置向导建立了站点之后,怎样进一步了解站点的设置可以进一步在高级模式下了解站点的设置2、对多个网站进行管理,要通过什么面板进行对多个网站进行管理是通过"文件"面板进行的3、思考建立一个个人网站应包括的内容、建立的栏目、需要的素材内容:文本、图形、链接、表格表单、Flash内容、计数器、时间戳栏目:主页日志相册留言关于素材:文本、图片、动画、midi、视频和音乐等考核内容及标准分值作品评语及成绩评定学生互评成绩20 非常熟练的完成操作,成绩:20设计与制作得分40心得及思考题得分40综合评语总分考核标准(分4个等级)1.优:在较好的完成实训任务书中的各项任务的基础上,有自己的创新,并能够应用所学的知识实现学生自己的设计想法。

2.良:能够按照要求完成实训任务书中的各项任务。

3.可:能够完成实训任务书中的各项任务,但有1-2个任务没有按照要求完成设计。

4.差:不能够完成实训任务书中的各项任务。

说明:1.浅灰色部分由学生填写2.白色部分为教师判分用3.本报告与学生实际作品相关联姓名学号专业/班级14秋计算机信息管理课程名称Dreamweaver网页设计教材网页设计与制作――Macromed ia Dreamweaver 8任务编号02 任务名称网页中插入导航条本次实训你掌握了哪些新的技术在网页中插入导航条正确设置导航条的各属性思考题1、怎样在页面中插入“鼠标经过图像”?在“文档”窗口中,将插入点放置在要显示鼠标经过图像的位置。

使用以下方法之一插入鼠标经过图像:1)、在“插入”栏的“常用”类别中,单击“图像”按钮,然后选择“鼠标经过图像”图标。

怎么使用dreamweaver制作网页教程dw建站设计网页

怎么使用dreamweaver制作网页教程dw建站设计网页

怎么使⽤dreamweaver制作⽹页教程dw建站设计⽹页这⼀款专业的⽹页制作软件,相信相关专业的⼈员都不会陌⽣。

可以说,它是第⼀套针对专业⽹页设计师特别发展的视觉化⽹页开发⼯具,利⽤它可以轻⽽易举地制作出跨越平台限制和跨越浏览器限制的充满动感的⽹页。

这⾥西西给⼤家带来⼀个dreamweaver制作⽹页的教程,初学DW的朋友可以参考⼀下。

⼀、定义站点1、在任意⼀个根⽬录下创建好⼀个⽂件夹(我们这⾥假设为E盘),如取名为MyWeb。

***备注:⽹站中所⽤的⽂件都要⽤英⽂名。

2、打开Dreamweaver,选择“站点—新建站点”,打开对话框。

在站点名称中输⼊⽹站的名称(可⽤中⽂),在本地根⽂件夹中选择刚才创建的⽂件夹(E:web)。

然后确定即可。

***备注:再次打开Dreamweaver,会⾃动找到刚才设⽴的站点。

如果有多个站点,可以在菜单“站点—打开站点”中去选择。

⼆、创建页⾯1、在本地⽂件夹E:\MyWeb下⾯的空⽩处,按右键选“新建⽂件”,这样就建好了⼀个页⾯,默认的⽂件名为untitled.htm。

htm 就表⽰这个⽹页⽂件是⼀个静态的HTML⽂件。

给它改名为index.htm。

***⽹站第⼀页的名字通常是index.htm或index.html。

其它页⾯的名字可以⾃⼰取。

2、双击index.htm进⼊该页⾯的编辑状态。

在标题空格⾥输⼊⽹页名称,按右键选页⾯属性,打开“页⾯属性”窗⼝。

在这⾥可以设置⽹站的标题、背景颜⾊或背影图像,超级链接的颜⾊(⼀般默认即可),其他都保持默认即可。

3.此时光标位于左上⾓,可输⼊⼀句话,如“欢迎来到我的主页”。

选取⽂字,⽤菜单“窗⼝/属性”打开属性⾯板,选取⽂字⼤⼩为6,再使⽂字居中,然后在⽂字前⽤⼏个回车使其位于页⾯中间。

4.如要选取字体,则选择字体中的最后⼀项:编辑字体列表。

然后在对话框中选+号,接着在“可⽤字体”栏中选择需要加⼊到字体列表中的⼀种字体,点击中间的按钮就可以加⼊了。

Dreamweaver网页设计实验

Dreamweaver网页设计实验

网页设计Dreamweaver实验实验1 网页元素的基本操作一.实验目的和要求1.掌握Dreamweaver中本地站点的创建2.掌握网页的新建、保存与浏览3.掌握文本的添加与格式化4.掌握图像元素的设置5.掌握表格的设置6.掌握对象的超链接二.实验内容和步骤在设计网页之前,我们必须首先建立网站,此后Dreamweaver会自动将所有网站资源(如网页文档、图片、动画、音频文件、视频文件、程序等)都保存到该网站文件夹之中,从而保证网站发布后网页上的所有元素都可以正常浏览。

网站分为本地站点与远程站点。

本地站点存放在本地硬盘上,远程站点存放在发布网站的服务器端。

这里我们介绍本地站点的创建。

1.创建本地站点①在E盘创建文件夹myweb,用来存放网站资源。

②启动Dreamweaver 8,依次单击菜单栏“站点/新建站点”命令,打开站点定义对话框,如图5-1所示。

图5-1 站点定义对话框③在“基本”选项卡中的第一个文本框中输入新建站点的站点名myweb,单击“下一步”按钮。

④在接下来的第二个对话框中,对于“是否打算使用服务器技术”选择“否,我不想使用服务器技术”,单击“下一步”按钮,如图5-2所示。

图5-2 是否使用服务器技术⑤在第三个对话框中,选择单选框“编辑我的计算机上的本地副本,完成后再上传到服务器(推荐)”,在下侧的文本框中输入“E:\myweb\”,如图5-3所示。

图5-3 如何使用编辑文件⑥如果路径比较复杂,也可以单击文本框右侧的文件夹按钮,在弹出的“选择站点myweb的本地根文件夹”窗口中确定文件夹的位置,如图5-4所示。

图5-4 选择本地根文件夹⑦在第四个对话框中,对于“如何连接到远程服务器”,选择“无”。

单击“下一步”,如图5-5所示。

图5-5 连接远程服务器⑧在最后一个对话框中显示了刚建立的本地站点的信息,如图5-6所示。

图5-6 本地站点信息⑨单击“完成”按钮,结束站点定义。

此时可以在“文件”面板中看到我们定义的站点myweb,如图5-7所示。

第五章使用Dreamweaver制作网页

第五章使用Dreamweaver制作网页
1、单击“框架” ”窗口”,打开框架面板 2、为每个框架指定网页文件
为名为topFrame框架指 定网页文件top.html
演示示例5:制作框架网页
20
制作框架网页
教员演示制作框架网页的步骤: 设置超链接
1、在left.html中设置超链接文本
right.html文件会在框架名 2、在属性窗口中,选择链接网页文件和输入目标框架名 为mainFrame窗口中显示
创建列表
7
什么是表格布局
单元格背 景图像 跨4列 单元格

表格背景色
跨3行 单元格
单元格 背景色
单元格内容居 中对其
如何实现这样的 表格布局?
使用表格进行布局时,一般把表格边框宽度 设为0,还有单元格的填充和间距也设为0。
8
表格的使用
教员演示创建表格布局页面: 创建跨行或跨列的表格
1、 “插入” ”表格”
16
小结2
使用Dreamweaver制作如下图所示的页 面效果
练习页面 练习答案
单选按钮 单行文本域
密码文本域
复选框
下拉列表
文本域
提交按钮 重置按钮
17
框架集页面 (FrameSet.thm)
框架网页
广告栏顶部框架 (top.html)
框架的 边框
导航栏左侧框 架(left.html)
详细内容页面右侧 框架(right.html)
第五章
使用Dreamweaver制作网页
本章任务
制作点卡购买页面
点卡购 买页面 客户中 心页面 用户注 册页面
制作用户注册页面
制作客户中心页面
2
本章目标
会用Dreamweaver实现已学的各类HTML 标签

用dreamweaver制作网页的实践报告

用dreamweaver制作网页的实践报告

目录目录 0摘要 (2)正文 (3)网页制作过程大纲 (3)具体操作步骤 (3)制作过程简介 (4)制作网页前的准备: (4)开始制作网页: (4)网页制作的要点: (5)实践心得 (6)学到的知识: (7)网页制作心得: (8)一.页面的设计方面 (8)二.网页视觉效果 (8)三.网页的整体布局和导航 (8)四.网页中文字、图像 (9)五.网页制作过程中的其他注意事项 (9)Web考试网页制作摘要在Internet飞速发展的今天,互联网成为人们快速获取、发布和传递信息的重要渠道,它在人们政治、经济、生活等各个方面发挥着重要的作用。

因此网站建设在Internet应用上的地位显而易见,它已成为政府、企事业单位信息化建设中的重要组成部分,从而倍受人们的重视。

对于现在的社会,科技的飞速发展已经成为社会发展的标志。

其中计算机的发展可谓快中之快,而在计算机的发展中计算机网络的发展又是首当其冲的。

计算机网络从为我们所知,到现在才经历的短短的几年时间,在这几年中随着计算机网络的广泛应用,特别是Internet 的普及和发展,网络已经成为了不可或缺的通信手段。

不论是最新的新闻信息、新产品的出台、新游戏的发布、最新的各种IT动态,包括等候就业人才的个人简历,我们都是可以通过网络来获得。

但是什么为这所有的一切提供平台的呢。

我们又是通过什么来获取这些消息的呢——对就是网页。

现如今,数以万计的网站以网页的方式提供了丰富、精彩的信息。

在人类社会进入信息时代的时候,在网络成为通信的主要手段的时候,在计算机网络普及的今天,网页也在它自己的岗位上做出了突出的贡献。

网页是我们在网络上的“代言人”。

我们将什么样的信息传达给浏览者,要讲述什么样的事情,网页在这里起着重要的作用。

企业网站在企业的网络营销当中占有及其重要的地位,只要是涉及网络宣传的企业,都应该建立属于自己的个性企业网站。

他不仅能够让企业在网络上展示自己的产品,促进实际销售的增长,更能够通过一根网线,向目标客户展示企业自身的形象。

如何使用Dreamweaver进行网页设计和编写

如何使用Dreamweaver进行网页设计和编写

如何使用Dreamweaver进行网页设计和编写第一章:Dreamweaver的介绍和安装1.Dreamweaver是什么Dreamweaver是一款功能强大的网页设计和编写软件,由Adobe公司开发。

它提供了直观的用户界面和丰富的功能,可以方便地创建和编辑网页。

2.Dreamweaver的安装在Adobe官网上下载Dreamweaver安装程序,运行安装程序并按照向导进行操作。

安装完成后,可以启动Dreamweaver开始网页设计和编写的工作。

第二章:创建新网页1.新建网页打开Dreamweaver,在菜单栏中选择“文件”->“新建”->“空白网页”,可以创建一个新的空白网页。

2.选择网页布局在新建网页的过程中,可以选择不同的网页布局。

可以根据需要选择固定布局或自适应布局,以及其他特定的布局选项。

第三章:编辑网页内容1.插入文本在网页中插入文本时,可以使用Dreamweaver提供的文本工具或直接复制粘贴文本。

还可以选择文本样式、大小、字体等。

2.插入图片和多媒体Dreamweaver支持插入图片和多媒体元素,可以使用菜单栏中的“插入”选项来插入图片、音频和视频等元素。

还可以设置它们的大小、位置和其他属性。

第四章:设计网页样式1.样式管理器Dreamweaver提供了样式管理器,可以轻松管理和编辑网页的样式。

通过样式管理器可以添加、删除和修改样式,还可以为不同元素设置不同的样式。

2.CSS样式可以使用CSS(层叠样式表)来设计网页的样式。

Dreamweaver提供了CSS编辑器,可以直观地编辑CSS代码,并且可以在代码视图和设计视图之间切换。

第五章:网页布局和导航1.布局工具Dreamweaver提供了丰富的布局工具,可以帮助设计和调整网页的布局。

可以使用表格、CSS布局、网格系统等来创建网页布局。

2.导航栏设计导航栏是网页中非常重要的一部分,可以使用Dreamweaver提供的导航栏工具来设计和创建导航栏。

如何使用Dreamweaver进行网页设计与编写

如何使用Dreamweaver进行网页设计与编写

如何使用Dreamweaver进行网页设计与编写Dreamweaver是一款强大的网页设计与编写工具,它提供了丰富的功能和工具,使用户能够轻松创建精美的网页。

本文将介绍如何使用Dreamweaver进行网页设计与编写,并按照以下几个方面进行分类讲解。

第一章: 界面与设置在开始使用Dreamweaver之前,用户需要了解界面和设置。

Dreamweaver的界面分为几个主要部分,包括工具栏、菜单栏、文件面板、代码面板等。

用户可以根据自己的需要进行自定义设置,例如设置代码显示颜色、字体大小等。

第二章: 网页结构与布局网页的结构和布局是网页设计的重要组成部分。

Dreamweaver 提供了各种布局工具,例如DIV和表格布局。

用户可以使用这些工具来创建网页的基本结构,然后使用CSS样式来定义和控制页面的布局。

第三章: 网页元素与样式网页设计中的元素和样式是网页的装饰和内容展示手段。

Dreamweaver提供了丰富的元素和样式库,用户可以轻松地添加图像、视频、音频等元素,并为它们应用各种样式和效果。

第四章: 交互与导航交互和导航是网页设计中的重要功能。

Dreamweaver提供了交互和导航工具,例如超链接和导航菜单。

用户可以使用这些工具来创建连贯的页面导航和用户交互,提高网站的可用性和用户体验。

第五章: 响应式设计与移动端适配随着移动设备的普及,响应式设计和移动端适配变得越来越重要。

Dreamweaver提供了响应式设计和移动端适配的工具和功能。

用户可以使用这些工具来创建适应不同屏幕大小和设备的网页,并进行实时预览和调整。

第六章: 网页优化与测试在完成网页设计和编写后,用户需要对网页进行优化和测试,以确保网页的性能和可访问性。

Dreamweaver提供了优化和测试工具,例如压缩代码、优化图像和进行浏览器兼容性测试。

用户可以使用这些工具来提高网页的加载速度和用户体验。

第七章: 网页发布与管理完成网页设计和编写后,用户需要将网页发布到服务器,并进行管理和维护。

网页实验报告

网页实验报告

实验名称:网页设计与制作实验目的:1. 学习和掌握网页设计的基本原理和制作方法。

2. 了解网页布局和美化的技巧。

3. 提高对网页性能和用户体验的认识。

实验时间:2023年X月X日实验地点:实验室实验器材:计算机、网页设计软件(如Dreamweaver、Photoshop等)实验内容:一、实验背景随着互联网的普及,网页设计已成为当今社会的一项重要技能。

一个美观、实用的网页不仅能够吸引更多用户,还能提升企业形象。

本实验旨在通过实际操作,掌握网页设计的基本技能。

二、实验步骤1. 创建新网页(1)打开Dreamweaver软件,创建一个新的空白网页。

(2)设置网页的基本属性,如标题、编码、背景色等。

2. 网页布局(1)使用Dreamweaver中的布局视图,创建一个两列布局。

(2)在左侧列中插入一个图片,并设置图片的宽度和高度。

(3)在右侧列中插入一段文字,并设置文字的字体、颜色和大小。

3. 网页美化(1)使用Photoshop对图片进行处理,如裁剪、调整亮度、对比度等。

(2)将处理后的图片保存,并导入到Dreamweaver中。

(3)对网页中的文字进行美化,如添加阴影、加粗等。

4. 网页性能优化(1)对网页中的图片进行压缩,减小文件大小。

(2)对网页中的CSS和JavaScript代码进行优化,提高网页加载速度。

5. 用户体验测试(1)邀请几位同学或朋友对网页进行测试。

(2)收集他们对网页的反馈意见,如页面布局、文字内容、图片质量等。

三、实验结果与分析1. 网页布局合理,图片和文字内容清晰。

2. 网页美化效果良好,符合审美要求。

3. 网页性能优化效果明显,加载速度较快。

4. 用户反馈意见主要集中在页面布局和文字内容方面,建议对布局进行调整,丰富文字内容。

四、实验总结通过本次实验,我们掌握了网页设计的基本原理和制作方法。

在实验过程中,我们学会了如何创建网页、布局、美化以及优化网页性能。

同时,我们还通过用户体验测试,了解了用户对网页的需求和期望。

Dreamweaver网页设计实验报告

Dreamweaver网页设计实验报告

实验报告专业XXXXXX班级XX 班学号XXXXXX姓名XXX报告完成日期2012-12-26指导教师XXX评语:成绩:批阅教师签名:批阅时间:一、制作时间2012年12月18日至2012年12月26日。

二、实习内容1、使用Dreamweaver制作网站,该网站为福建工程学院网站2、网站不少于8个页面,主页和各模块相关页面;3、页面中包含文字、图片;4、使用CSS实现网页相关页面设置,要求在实现网页内能够显示文字,图片等信息;5、使用网页浏览器进行网站测试。

三、实习环境1、硬件环境:计算机一台;2、软件环境:Dreamweaver cs4;3、测试环境:IE、firework等网页浏览器。

四、网站总体设计1、网站主题本网页是以福建工程学院网站为主题,针对不同的年龄阶段的人给出了不同的学院的信息。

2、设计思路首先构思了基本网页的布局,主页采取了常用的1-(1+1+1),附页采用了1-(1+1),上了多个网最后决定参照福建工程学院的官方网站进行制作,但是布局并不相同素材取自福建工程学院官方网站,部分图片取自百度,网站包括1个主页7个子页,子页包含了所有的学校状况,分别为:学校简介、现任校领导、教学机构、管理机构、校纪校训校歌、校园风光、新校区建设;采用了较难的二级菜单和 JVAV技术实现导航栏上面的图片进行4张轮播。

五、制作步骤1.首先确定网页的主题后,从网上查看各名校的网站,并从中寻找思路开始做网页。

经过长时间的浏览,最终选择福建工程学院作为参照(网址:)2.受福建工程学院主页的影响我自学了图片轮播和二级菜单,从而制作了轮播图片和二级菜单。

3.由于对于JVAV和表单的知识并不是非常了解所以有些地方需要实现的实现不出来放弃了,期中研究了最久的就是导航轮播和下面的有块区域的图片轮播,结果因为不知道如何同时初始化2个JVAV函数最后以失败告终只好放弃4.本次制作最难的地方是导航菜单的二级菜单和图片轮换5.原计划那些JVAV代码因为无法同时初始化他们放弃了只好以一些列表代替6.最后,将一些小细节的东西做了些处理,最后打包上交。

实训一制作一个简单的网页

实训一制作一个简单的网页

实训一制作一个简单的网页(总21页)--本页仅作为文档封面,使用时请直接删除即可----内页可以根据需求调整合适字体及大小--实训一创建和管理站点、制作站点首页实训目标:用Dreamweaver制作一个简单的网页一、用Dreamweaver创建和管理站点(一)在D盘上创建“畅想未来”站点在菜单栏中选择“站点”→“新建站点”,在文本框中输入网站的名称“畅想未来”。

(二)对站点进行规划1.在文件面板中搭建站点的结构(1)在站点根文件夹下建立4个子文件夹“city”、“novel”、“outspace”和“travel”。

在文件面板中右单击站点“畅想未来”,选择“新建文件夹”命令。

(2)在文件夹“city”中建4个子文件夹“images”、“sound”、“swf”和“webpages”。

(3)将文件夹“city”中的4个子文件夹分别复制到“novel”、“outspace”和“travel”中。

方法:依次选中“images”、“sound”、“swf”和“webpages”,然后按住Ctrl键,分别将其拖动到“novel”、“outspace”和“travel”中。

结果如下图所示。

(二)设置网站首页,重新搭建站点结构1.设置网站首页(1)右单击站点的根文件夹,从弹出的快捷菜单中选择“新建文件”命令。

(2)将文件重命名为“”。

(3)将其设置成首页。

2.重新搭建站点结构(1)将站点的根文件夹下的4个子文件夹“city”、“novel”、“outspace”和“travel”删除。

(2)在站点的根文件夹下新建2个子文件夹“images”和“webpages”,如下图所示。

在Dreamweaver中打开文件“”,并将其另存为。

二、设置网页属性选择“修改”→“页面属性”,打开“页面属性”对话框。

(一)设置页面外观在“分类”→“外观”中按下图设置“页面字体”:宋体、“文本颜色”:#034881、“背景颜色”:#B8DCF4。

Dreamweaver静态网页设计方案实验一

Dreamweaver静态网页设计方案实验一

实验一 Dreamweaver 基本操作一、实验目的文本是网页的基本组成部分,Dreamweaver提供了多种向网页中添加文本和设置文本格式的方法。

通过本实验学习如何建立与制作出编排有序、整齐美观的网页格式文本。

二、实验步骤1.文本输入操作步骤:新建或打开网页,将插入点定位到要插入文本的位置;直接输入文本。

注意:如果要在文本中输入空格,采用以下方法之一:按Ctrl+Shift+Space键;将中文输入法切换到全角模式,按空格键。

注意观察文本插入时,代码栏的变化。

网页的主题放在标签的哪个部分。

2.建立段落或换行在输入文字时,若一行长度超过屏幕的显示范围,自动换行,不须另外使用其他按键换行。

若要将文本做段落排列,方法如下:∙建立段落:按下[Enter]键,插入一个段落标记<p>,两行之间有段间矩。

∙强制换行:按"Shift"+"Enter"键,插入一个换行符<br>,两行之间无段间矩。

3.从其他应用程序中复制文本从其他应用程序或窗口复制文本后粘贴到网页中,执行以下操作步骤:●在其他应用程序中选择并复制文本●切换到 Dreamweaver的“设计”视图中,将插入点定位在网页中要插入文本的位置●选择“编辑”→“选择性粘贴”,出现“选择性粘贴”对话框4.选择所需要的粘贴设置选项●仅文本;原文本中的所有格式、表格、段落等将被删除,仅粘贴纯文本。

●带结构的文本(段落、列表和表格等):粘贴文本并保留基本格式设置(例如段落、列表和表格)●带结构的文本以及基本格式(粗体、斜体):粘贴带段落和表格结构以及带简单格式(例如加粗、倾斜、下划线等)的文本)●带结构的文本以及全部格式:粘贴文本并保留所有结构、HTML格式设置和CSS样式。

可以通过设置“粘贴首选参数”,将需要的粘贴选项设置为默认选项。

此后再从其它应用程序中复制文本时,可以直接选择菜单“编辑”→“粘贴”5. 将word或Excel文档导入网页●打开要插入Word或Excel文档的网页●确保您处于“设计”视图中。

Dreamwever网页设计实验报告

Dreamwever网页设计实验报告

**学院计算机系综合性实验实验报告课程名称《网页制作》实验学期 2010 至 2011 学年第 2 学期学生所在系部计算机系年级 2009 专业班级 Z091 学生姓名学号任课教师胡英实验成绩计算机系制《网页制作》课程综合性实验报告开课实验室:基础一2011 年 5 月31 日实验题目***网站的开发一、实验目的使用Dreamweaver、Fireworks、Flash三种软件完成网页的制作。

二、设备与环境微机、Dreamwaver 8、Fireworks 8、Flash 8三、实验内容1.按照特定的主题制作一个完整的网站。

2.使用Dreamweaver、Fireworks、Flash三种软件完成网页的制作。

3.网站中要包括表格/框架/层布局、图像、文本、超级链接、导航、CSS样式。

网站页面总数不少于6个。

4.至少要包括3个自己制作的Flash动画。

上交文件中要包括该动画文件的源文件*.fla文件和导出文件。

5.至少要包括3个自己用Fireworks制作的图像文件,并且在每个图像文件中应用至少两种学过的技术手段进行处理。

上交文件中要包括该图像文件的源文件*.png文件和导出文件。

6.尽可能多地使用学过的技术手段。

7.不允许抄袭其他同学的内容,如果两人有雷同,两个人都按照不及格处理。

8.不允许从网上下载别人的网站当作考试内容上交。

9.在上交文件中主页一律以index.htm命名。

10.把所有文件和文件夹放在一个总的目录下,目录以:班级+姓名+学号最后两位的形式命名。

例如:计算机Z091张三03.rar。

将index.html放在该文件夹下。

最后将该目录压缩成一个*.rar文件。

四、实验结果及分析一.网站内容1.本网站的设计是仿照《网页制作》第十一章的设计风格。

主题为“我的浪漫小屋”。

站点文件夹wangye共有十一个子文件夹。

分别为:◆images(用于放置处理好的图片)◆source(用于存放源图片以及处理的好的FIREWORK文件)◆music(存放主页音乐)◆flash(存放所用到的flash导出文件)◆text(所用到的文本资料)◆wenxuetiandi(存放做好的文学天地网页文件)◆yingjixinshang(存放做好的影集网页文件)◆yinyuejiayuan(存放做好的音乐网页文件)◆youmoyizhan(存放做好的幽默驿站网页文件)◆library(库文件夹)◆templates(模板文件夹)站点文件夹下,其中index.htm为主页网页文件,survey.htm为网站调查网页文件,mycss.css为css文件。

相关主题
  1. 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。

四、实验报告
根据“二、实验内容及步骤:”的目录 任选其中一个实验内容,将实验步骤写 在实验报告书上。
实验报告应该包括以下几点内容: 一、实验目的 二、实验内容 三、实验步骤 四、实验心的/总结
谢谢!
里直接阅览。
若运行正常则出现窗口如下图:
(三)创建新网页并测试预览 网页
网站设计好后,在该网站下创建两个新 网页:first.html和first.asp。并对他们进 行预览测试。如果预览成功,则如下图 所示:
图1(文件first.html):
图2(first.asp)
网页源代码参考:
第二种方法:针对iis安装后不能正常启动的情 况。
步骤1、下载一个程序“aws.exe”绿色软件(或 是“简易iis服务器”),并将文件复制到网站的 根目录下。
步骤2、点击运行该程序,即可自动运行网站 的默认首页。或是在浏览器里输入网址: localhost/index.html
127.0.0.1/index.html
设置“本地根文件夹”路径: D:\DM实例
2)设置“测试服务器”选项参数,如图:
在“测试服务器-URL前缀”一栏输入: localhost/DM站点/
在“测试服务器文件夹”一栏输入网站 的具体路径:
D:\DM实例
步骤3、最后在浏览器里测试并浏览网页, 选择“文件-在浏览器中预览-IExproler 6.0”或是按快捷键“F12”,如果连接正常 则如下图所示:
步骤4、选择第一项(默认推荐),并在“文 件存储位置”一栏输入具体路径,如“D:\DM 实例”,点击“下一步”,如图:
步骤5、在“如何连接到远程服务器”一栏选 择“无”,点击“下一步”。最后点击“完成” 即可。随后出现对话框,如图:再点击“完成” 即可。
(二)在dreamweaver中管理站点, 并和测试服务器建立连接
1、 First.html文件: <html> <head> <title>HTML实例</title> </head> <body> <font size=7>欢迎访问WEB!</font> </body> </html>
2、 first.asp文件: <% language="vbscript" %> <htmБайду номын сангаас> <head> <title>ASP实例</title> </head> <body> <% For i=3 to 6 %> <font size=<% =i %> > 欢迎访问WEB!<br> </font> <% next %> </body> </html>
步骤3、在 dreamweaver里面修改测试服 务器设置参数:
1)修改“高级-本地信息”的选项参数 在“http地址:”一栏输入 : localhost/ 或者
127.0.0.1
2)修改“高级-测试服务器“一栏的参 数
在“URL前缀”一栏输入: localhost/ 或者
127.0.0.1/ 步骤4、最后按快捷键F12即可在浏览器
(一)在dreamweaver中建立 站点
假设需要D盘新建一个站点名为“DM站点”。 具体步骤如下:
步骤1、点击菜单“站点-编辑站点”,出现对 话框,如图:
步骤2、点击“新建”,出现站点定义对话框, 如图:
在”站点名称”一栏输入:“DM站点”,点 击“下一步”,如图:
步骤3、选择“否,我不想使用服务器技术” (如果用到.asp文件,则需要选择“是”), 点击“下一步”,如图:
第一种方法:直接和iis服务器连接 步骤1、进入iis信息服务台,创建虚拟目
录,如命名为“DM站点”,并将虚拟目 录的路径指向刚才建立的站点“D:\DM 实例”;
步骤2、进入Dreamweaver修改站点的属性,如下图, 1)点击“高级”,修改“本地信息”选项参数:
在“本地信息-http地址:”一栏输入 : localhost/DM站点/
一、实验目的
使用Dreamweaver制作一个简单的个人 网站,能够实现个人网站最基本的功能。 掌握Dreamweaver的基本操作、网页基 本元素的使用方法和操作技巧等。
二、实验内容及步骤:
1、在Dreamweaver中创建并管理网站
2、创建编辑新网页并测试预览 3、在outlook中设置本地邮箱
相关文档
最新文档