网页设计与制作实验报告
网页设计与制作实验指导一览表
实验1 HTML语言
实训目的:
为了让学生能熟悉学习网页不可避免要接触的HTML语言,达到用该语言可以建立一个简单的网页的目的,同时了解建立站点是做网站必不可少的,要掌握建立站点的方法。
素材准备:
准备制作网页所需的文字素材、图像素材。
实验课时:
2学时
实验内容:
1.创建站点;
2.新建网页以及保存,重命名;
3.输入HTML语言。
实验步骤:
1.在E盘中新建本地根文件夹,命名为root,并在该文件夹中新建image
文件夹以存放网站中所要用到的图片。
2.定义站点:设置 "站点名称",命名为 "mysite";设置本地根文件夹,指定
为E盘下的root文件夹;设置 "HTTP地址"为localhost。
3.创建与设置文档的页面属性:新建一个页面,保存名为“HTML基础”
的文档。
4.切换代码模式下,输入代码。
5.保存文件,预览文件效果。
实验过程注意事项:
1.在创建站点的过程中注意建立本地文件夹,文件夹命名最好为英文;网站
中所有的文件最好取名为英文;注意文件的路径;
2.所有的图片文件单独放在image文件夹内。
实验思考:
除了用HTML语言来做这个网页,还有没有其它的方法?
书写实验报告要求:
根据最终所作的网页,写出实验报告。
页面效果图:
图1-1
实验2 初识Dreamweaver
实验目的:
为了让学生能熟练掌握Dreamweaver的安装与卸载,启动与退出,基本工作环境和设置,对Dreamweaver操作环境有一定了解。
素材准备:
准备好从网上下载的安装程序。
实验课时:
2学时
实验内容:
1.安装Dreamweaver:
2.Dreamweaver的启动与退出:
3.了解工具栏、菜单栏、标题栏等工作环境:
4.卸载Dreamweaver
实验步骤:
1.打开从网上下载的Dreamweaver程序,双击安装。
2.安装完成后输入注册号。
3.启动Dreamweaver,并查看工具栏、菜单栏、标题栏等工作环境。
4.退出Dreamweaver。
5.卸载Dreamweaver
实验过程注意事项:
1.安装过程完成后,要激活。
实验思考:
从“控制面板”里删除程序与从安装到的目录文件里删除有什么区别?
书写实验报告要求:
写出本次实验报告。
实验3 文本操作
实验目的:
为了让学生能熟练掌握在Dreamweaver mx中如何输入文本,调整设置文本的格式;如何插入特殊字符、文本列表、水平线、时间、注释的方法。
素材准备:
准备制作网页所需的文字素材、图像素材、音乐素材。
实验课时:
2学时
实验内容:
1.输入文本:
2.调整文本:
3.插入特殊字符:
4.插入文本列表:
5.插入水平线:
6.插入时间:
7.插入注释:
8.设置文本格式:
实验步骤:
1.新建一个页面文件;
2.输入文本,调整文本的间距,设置文本的格式;通过“属性”面板中的“格
式”和“颜”等参数,将文字设为标题格式,并改变其颜;
3.输入一段不带格式的文字,选择“常用”工具栏上的“文本”单选项目,
利用换行按钮对文本进行换行处理,实现分段的效果;
4.插入特殊字符、项目符号、水平线、时间、注释等内容;
实验过程注意事项:
1.在“编辑字体列表”对话框中选择要添加的字体要一个个地添加进去,不
能全部选取再添加;
2.当输入文本时要插入多个连续的空格,必须要“编辑”菜单下的“首选参
数”中设置;
3.换行的几种方式:自行换行;按ENTER强行换行;按SHIFT+ENTER换行操
作;
实验思考:
如何插入版权符号?
如何插入特殊字符“¥”?如何保存网页内容
书写实验报告要求:
根据调试结果,写出实验报告
实验4 图像操作
实验目的:
为了让学生熟练掌握在Dreamweaver mx中插入图像,学会设置图像属性;如何插入鼠标经过图像、插入图像占位符的方法,掌握图文混排的技巧等操作。
素材准备:
准备制作网页所需的文字素材、图像素材、音乐素材。
实验课时:
2学时
实验内容:
1.插入图像:
2.设置图像属性:
3.插入鼠标经过图像:
4.插入图像占位符:
5.图文混排操作:
实验步骤:
1.打开上次实训所做的页面文件;
2.插入图像,在属性面板对图像的格式进行设置;
3.插入鼠标经过图像、图像占位符;
4.将图片和文字进行混合排版;
5.保存文件,预览文件效果;
实验过程注意事项:
1.插入的图像必须放在站点文件夹下的image文件夹内;
2.设置图片的热点区域可选任意的工具;
实验思考:

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。