网页制作与网站设计实验报告Word文档格式.docx
《网页制作与网站设计实验报告Word文档格式.docx》由会员分享,可在线阅读,更多相关《网页制作与网站设计实验报告Word文档格式.docx(21页珍藏版)》请在冰豆网上搜索。
h3align="
face="
"
size=5color=ff0000>
傲游梦想之城<
/h3>
/i>
fontface="
size=10color=0000ff>
一去二三里,烟村四五家;
亭台六七座,八九十之花。
/font>
/body>
/html>
网页效果如下:
2、增加移动字幕和插入图片。
网页图像的插入和超链接的运用<
marqueebehavier=scrollscrollamount=10align=centerswidth=200height=100bgcolor=#00ff00>
戚薇图像展<
/marquee>
palign=center>
imgsrc=F:
\图\新建文件夹\戚.jpg>
/img>
/p>
超链接的创建
2012年3月8日
1、掌握HTML中超链接的原理和应用方法,对同一个网页内部的链接、不同网页之间的链接、文字链接、图像链接的用法进行验证。
2、主控网页,通过超链接可以进入其它网页;
不同网页之间可以通过文字或图片链接相互跳转。
1、超链接的概念及类型。
超链接是指从一个网页指向一个目标的连接关系,这个目标可以是另一个网页,也可以是相同网页上的不同位置,还可以是一个图片,一个电子邮件地址,一个文件,甚至是一个应用程序。
而在一个网页中用来超链接的对象,可以是一段文本或者是一个图片。
超链接在本质上属于一个网页的一部分,它是一种允许我们同其他网页或站点之间进行连接的元素。
2、超链接的创建。
超链接的运用<
h3align=center>
戚薇相关资料<
br>
ahref="
\图\新建文件夹\戚4.jpg>
表格的制作
2012年3月15日
掌握HTML与表格样式相关的功能设置:
表格单元格背景颜色背景图像设置、跨行跨列合并等设置。
表格的使用<
tableborder=1>
captionalign=center>
b>
第二次作业<
/b>
/caption>
tralign=centerbgcolor=#ff0000>
th>
/th>
数学<
英语<
管理<
运筹学<
政治<
/tr>
tralign=center>
throwspan="
2"
上学期<
td>
90<
/td>
tralign=left>
tdrowspan="
colspan="
align=centerbgcolor=#0000ff>
/table>
表单的制作
2012年3月22日
1、掌握HTML表单的作用及网页中表单域和表单元素的用法。
2、能够应用表格来对表单元素进行布局。
表单的应用<
formname="
formlogin"
id="
form1"
action="
login.asp"
method="
post"
h3>
个人信息登记表<
姓名:
inputtype="
text"
name="
textname"
/input>
br/>
性别:
radio"
radio1"
checked="
checked"
男<
女<
登录密码:
password"
pwd"
value="
1234"
个人简介:
textareaname="
areaname"
cols=36rows=4>
请在这儿输入个人基本情况。
/textarea>
submit"
subm"
提交"
reset"
res"
重置"
/form>
框架的制作
2012年3月29日
1、掌握网页的基本框架。
2、掌握框架、框架集标签的用法。
3、握使用代码生成框架网页。
框架的应用<
framesetcols=137,*>
framesrc="
A.html"
framesetrows=82,*>
B.html"
C.html"
/frameset>
网页效果如下:
行为的创建
2012年4月12日
1、下拉式菜单的设计。
2、为对象设置行为。
3、使用行用控制层,制作行为的动态效果。
步骤如下:
1、通过选择菜单【窗口】里的【行为】命令,或直接按下快捷键shift+F4即可打开【行为】面板。
2、打开【插入】菜单中的【布局】,选择【绘制APDiv】命令,在页面上绘制三个矩形框,可以自行设置其大小,在这里,我选择了高50像素、宽150像素。
3、分别在三个矩形框里添加一个1行1列,宽150像素的表格,这样有利于文字的输入与设置。
然后调整大小,让其与矩形框完全吻合,可以在属性栏里设置其背景色等细节部分。
4、在【院系设置】栏下面,绘制一个APDiv元素,将其大小设置为高150(因为我打算在这里输入三行文字),宽150像素。
接下来,仿照步骤3,添加一个3行1列的表格,具体设置也如上。
5、选中【院系设置】,为其添加行为(动作+事件),当鼠标从上面滑过时,显示下面的矩形框,当鼠标离开时,下面的矩形框隐藏。
具体如下:
6、选中【管理学院】所在矩形框,为其添加如步骤5所示的行为。
实现党鼠标滑过时,显示该矩形框,当鼠标移出时隐藏该矩形框的效果。
7、保存该页面。
并查看、测试效果。
如下:
层的应用
2012年4月19日
1、能够根据要求设置层的大小。
2、熟练运用层的位置、层的嵌套以及叠加。
1.在网页head头部定义一个apDiv1的ID样式,在网页主体body元素内插入一个Div元素,该元素应用了ID样式apDiv1。
metahttp-equiv="
Content-Type"
content="
text/html;
charset=utf-8"
/>
无标题文档<
styletype="
text/css"
!
--
#apDiv1{
position:
absolute;
width:
200px;
height:
115px;
z-index:
1;
left:
130px;
top:
40px;
background-color:
#FF0000;
}
-->
/style>
divid="
apDiv1"
/div>
2.表格和层的相互嵌套
99px;
120px;
11px;
#EEE;
overflow:
auto;
49px;
#apDiv2{
2;
111px;
#apDiv3{
3;
211px;
48px;
tablewidth="
300"
border="
1"
cellpadding="
5"
cellspacing="
0"
tr>
菜单1<
菜单2<
菜单3<
p>
菜单1-1<
菜单1-2<
菜单1-3<
apDiv2"
菜单2-1<
菜单2-2<
菜单2-3<
apDiv3"
菜单3-1<
菜单3-2<
菜单3-3<
CSS
2012年4月26日
1、了解CSS的标签样式,类样式,ID样式和伪类样式。
2、会使用CSS的嵌入式样式表。
3、掌握CSS的部分属性分类与使用。
HTML代码如下:
p{
font-family:
黑体"
;
font-size:
20px;
color:
rgb(255,0,0);
text-align:
center;
}
.fontclass1{
幼圆"
16px;
rgb(0,0,255);
#fontid1{
宋体"
13px;
rgb(0,255,0);
-->
莫生气<
divclass="
fontclass1"
人生就像一场戏,因为有缘才相聚。
spanid="
fontid1"
相扶到老不容易,是否应该去珍惜?
/span>
JavaScript语句
2012年5月10日
1、掌握并练习JavaScript的基本语句。
2、加深对网页制作所涉及的相关技术的理解。
3、初步了解JavaScricpt脚本源程序。
4、练习文件对象的使用。
改变背景颜色<
Scriptlanguage="
JavaScript"
type="
text/JavaScript"
functionchgBg(color)
{document.bgColor=color;
/Script>
tableheight="
45"
align="
tdwidth="
150"
请选择背景颜色:
50"
bgcolor="
#FF0000"
onClick="
chgBg(this.bgColor)"
&
nbsp;
#00FF00"
#0000FF"
#CCCCCC"
ASP
2012年5月17日
1、ASP运行环境的建立。
2、掌握VBScript语言基础。
3、掌握ASP内置对象的应用。
Cookies总合示例<
%ifRequest.Cookies("
UserName"
)<
"
then
Response.write"
欢迎您:
request.Cookies("
)
else
%>
98%"
height="
30"
#666666"
trbgcolor="
请输入:
用户名:
inputname="
size="
12"
电子邮件:
Email"
保存时间:
selectname="
Save"
save"
optionvalue="
保存1天<
/option>
7"
保存1周<
保存1月<
/select>
确定"
%
ifrequest.Form("
andrequest.Form("
Response.cookies("
)=Request.Form("
).Expires=date()+Cint(Request.Form("
))
Response.redirect("
6-19.asp"
Response.end
endif
实验总结
通过这门课程的学习,我了解了网页制作与网站设计的相关知识以及在操作的过程中应该注意的问题。
虽然这门课程时间不长,但老师还是给我们讲了许多的内容,包括HTML语言,行为,层,JavaScript语句,ASP等。
其中HTML语言在网页制作中发挥了比较重要的作用,可以大大提高网页制作的效率。
总而言之,经过对《网页制作与网站设计》课程的学习,培养了我对网页制作与设计的强烈兴趣,拓宽了我的知识面,提高了我的综合能力。
相信在以后的生活与工作中,它也会给我带来有益的帮助。