Web实验报告课程设计Word文档格式.docx
- 文档编号:14103585
- 上传时间:2022-10-18
- 格式:DOCX
- 页数:32
- 大小:3.37MB
Web实验报告课程设计Word文档格式.docx
《Web实验报告课程设计Word文档格式.docx》由会员分享,可在线阅读,更多相关《Web实验报告课程设计Word文档格式.docx(32页珍藏版)》请在冰豆网上搜索。
2.home.html里
内容栏:
左边一栏:
第一模块运用javascript更改style的背景颜色,设置了一个数组。
第二模块制作表单并加入了大量的函数,选择循环语句进行判断与提交并作出提示语句。
第四模块制作超链接并将列表项换成图片。
右边一栏:
进行样式设置等,下面制作了一个选项卡,通过设置函数等,记录上一步的操作oldobj,在鼠标移动到上面时自动记录。
3.在lesson.html里
进行样式设置
4.在prompation.html里设置了悬浮时的一些操作,起到放大镜的效果,
5.在contact.html里制作了一个表单
四、实验步骤
1.明确需求,掌握要做什么,并画出框架图,理清思路。
2.在网上下载所需图片和文本介绍,并分清各模块的内容。
3.构建各网页的框架,设置好样式和属性。
4.正式往框架内敲入代码,实现各项功能的函数等。
5.页面调整与优化,设置自适应。
6.对页面美观进行加工。
7.对代码进行封装,进行标注与分块。
五、实验代码
1、Index.html
<
!
DOCTYPEhtml>
html>
<
head>
<
metacharset="
utf-8"
/>
title>
味道扬州<
/title>
linkrel="
stylesheet"
type="
text/css"
href="
css/框架.css"
>
scriptsrc="
js/首页.js"
text/javascript"
charset="
UTF-8"
/script>
js/用户注册.js"
js/选项卡.js"
/head>
bodyonload="
startChageImg()"
divid="
div_box"
<
--==============标题栏=============-->
top"
<
divclass="
div-img-box"
<
imgid="
imgidA"
src="
img/1.jpg"
width="
100%"
height="
300px"
/div>
div-toolsA"
class="
div-toolbar"
spanonmouseover="
changeImg(0,this)"
onmouseout="
1<
/span>
changeImg(1,this)"
2<
changeImg(2,this)"
3<
--==============导航栏=============-->
daohang"
ul>
li>
aclass="
daohang_home"
home.html"
target="
main"
首&
nbsp;
页<
/a>
/li>
daohang_lesson"
lesson.html"
美食学堂<
<
ulid="
id_ulA"
<
扬州炒饭<
狮子头<
灌汤包<
/ul>
daohang_promation"
promptation.html"
美食展示<
daohang_contact"
contact.html"
联系我们<
--==============内容栏=============-->
main_left"
--左边空白-->
main_center"
--中间-->
iframesrc="
name="
frameborder="
0"
/iframe>
main_right"
--右边空白-->
--<
-->
bttom"
(c)Copyright2016盛金秋.AllRightsReserved.<
/body>
/html>
2、lesson.html
styletype="
#main_center_lesson{
width:
99%;
height:
596px;
background-image:
url(img/jiao.png);
/*border:
1pxredsolid;
*/
background-position:
center;
background-repeat:
no-repeat;
background-size:
100%100%;
/*position:
relative;
}
.main_center_title_lesson{
100%;
height:
40px;
font-family:
"
楷体"
;
font-weight:
900;
color:
blueviolet;
font-size:
30px;
absolute;
margin-left:
10px;
.main_center_title:
hover{
text-decoration:
underline;
.main_center_cont{
30%;
65%;
40%;
font-family:
仿宋"
font-size:
20px;
color:
#000000;
700;
position:
top:
8%;
text-indent:
15px;
#img_huaiyang{
1%;
.canyin{
15%;
border-top:
2pxreddotted;
#2F4F4F;
font-family:
font-weight:
margin-top:
.yangzhoums{
50px;
#FF8C00;
25px;
background-color:
#E6E6FA;
border-radius:
7px;
.shizitou{
letter-spacing:
/style>
body>
main_center_lesson"
main_center_title_lesson"
imgsrc="
img/huanyang.jpg"
250px"
id="
img_huaiyang"
main_center_cont"
扬州菜以拆烩鲢鱼头、扒烧整猪头、蟹粉狮子头“三头”为代表,大煮干丝体现了淮扬菜的刀功,“三套鸭”则将菜鸽藏于野鸭腹中再将野鸭藏于家鸭腹中,野鸭喷香,菜鸽细酥,大胆的创新造就了无上美味。
三头宴和红楼宴、全藕宴一起被称为扬州菜肴三绝。
br>
&
&
扬州小吃也极负盛名。
大名鼎鼎的扬州干丝,一片豆腐干可被
-moz-transition:
all.5sease;
/*Firefox*/
-ms-transition:
/*IE9*/
-o-transition:
/*Opera*/
transition:
.main_cla_imgall.main_img_title{
position:
top:
0;
right:
bottom:
left:
z-index:
10;
background:
rgba(0,0,0,0.5);
-webkit-transition:
/*SafariandChrome*/
-moz-transit
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- Web 实验 报告 课程设计
![提示](https://static.bdocx.com/images/bang_tan.gif)