web网页设计与制作实习报告.docx
《web网页设计与制作实习报告.docx》由会员分享,可在线阅读,更多相关《web网页设计与制作实习报告.docx(10页珍藏版)》请在冰豆网上搜索。
web网页设计与制作实习报告
网页设计与制作
实验报告
学生姓名
班级
学号
指导教师
文志华
2015.5.23
实验一简单网页制作
一、实验目的
1.熟悉Dreamweaver软件的操作界面。
2.掌握建立本地站点的方法。
3.掌握简单网页制作方法。
4.掌握超链接的建立方法。
三、操作步骤
1.创建“潜水俱乐部”站点
(1)在D盘新建文件夹,命名为shiyan1;
(2)将images文件夹和gallery文件夹复制到中shiyan1中;
(3)启动Dreamweaver,使用“站点|新建站点”命令创建站点。
2.制作“俱乐部首页”。
(1)新建网页。
(2)使用“文件|保存”命令保存网页,命名为index.html。
(3)在文档工具栏上设置网页标题“泡泡潜水俱乐部欢迎你”。
(4)从“文本.txt”中将首页的相关文字粘贴到网页中。
(5)设置一级标题、二级标题、三级标题、项目列表、编号列表。
(6)插入图像。
(7)在Copyright后插入版权符号©。
(8)在电话号码之间插入半角空格。
(9)在电子邮箱地址上建立超链接,mailto:
vip@BubbleU。
(10)选中网页内容,然后单击“插入Div标签”按钮,分别插入header、navigation、mainContent、footer共4个Div。
(11)保存网页,按F12,预览网页。
四.实验结果
实验二XHTML语言
一、实验目的
1.掌握XHTML语法。
2.掌握XHTML标记及属性。
3.掌握XHTML标记校验的方法。
二、实验内容
制作“学校主页-新闻中心-学校新闻-校领导赴包装设计艺术学院调研”的网页
校领导赴包装设计艺术学院调研
浏览:
2827次日期:
2015-03-21
三、操作步骤
1)创建站点
(1)在D盘新建文件夹,命名为shiyan2;
(2)将“文本.txt”和images文件夹复制到中shiyan2中;
2)用记事本打开“文本.txt”。
3)选择“文件|另存为”命令,将文件另存为shiyan2.html。
4)在网页中添加XHTML标记和属性。
实验标题字体黑体蓝色40px
日期字体宋体灰色大小12px正文字体楷体大小14px
5)用浏览器打开,并修改发现的错误。
四、实验制作结果
实验三导航栏制作
一、实验目的
1.掌握垂直导航条的制作方法。
2.掌握水平导航条的制作方法。
二、实验内容
制作学校样式的导航条。
三、操作步骤
导航栏制作
body,div,ul,li,h1,h2,h3,h4,h5,h6{
margin:
0px;
padding:
0px;
}
#nav{
width:
800px;
height:
51px;
margin:
100pxauto;
background:
url(nav_bg.jpg)repeat-x;
}
#navul{
list-style-type:
none;
}
#navulli{
float:
left;
width:
100px;
height:
51px;
background:
url(nav_01.jpg)no-repeatrightcenter;
}
#navullia{
display:
block;
width:
100px;
height:
51px;
line-height:
51px;
text-align:
center;
color:
#ffffff;
text-decoration:
none;
}
#navullia:
hover{
width:
100px;
height:
51px;
background:
url(nav_03.jpg)no-repeat;
}
- 学校概况
- 学科建设
- 科学研究
- 师资队伍
- 教学管理
- 招生就业
- 对外交流
- 学校首页