网页设计作业_第1页
网页设计作业_第2页
网页设计作业_第3页
网页设计作业_第4页
网页设计作业_第5页
已阅读5页，还剩6页未读， 继续免费阅读

付费下载

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

《网页设计》大作业

专业：化学工程与工艺学院:化学工程学院学号:0120920390311姓名：王战科

（以下题目文档要求：①设计界面②程序源代码）

一、设计网页，用滚动字幕显示为：“武汉理工大学欢迎您！二（20分）

（要求文字上、下、左、右交替滚动）

参考界面如图lo

武汉理工大学欢迎您!

答：1.设计界面

武汉理工大专

我.河羽丁十里西诅1你1

比］以中-L人子队足1心1

t学欢迎您！

2.程序源代码

<!DOCTYPEhtmlPUBLICn-//W3C//DTDXHTML1.0Transitional//ENn

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<htmlxmlns="http:〃/1999/xhtml”>

<head>

<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>

vtitle>王战科网页设计大作业第一题v/title>

<styletype="text/css">

<!-

.STYLE4{

font-size:24px;

color:#FF0000;

)

->

</style>

</head>

<body>

<formid="forml”name="forml"method="post"action="">

<tablewidth="632nheight="260"border="lnalign="centerncellpadding="16n

bordercolor="#0000FFn>

<tr>

<tdwidth="277,1xmarqueedirection=Hdown"behavior="scroll">

<spanclass="STYLE4”>武汉理工大学欢迎您！v/span></marquee>v/td>

<tdwidth="279"xmarqueedirection^"left"behavior="scroll">

<spanclass="STYLE4”>武汉理工大学欢迎您！</span>v/marquee>v/td>

</tr>

<tr>

<td><marqueedirection、'up"behavior="scroll">

<spanclass="STYLE4">武汉理工大学欢迎您！</span></marquee>v/td>

<tdxmarqueedirection="right"behavior=nscroll">

<spanclass="STYLE4”>武汉理工大学欢迎您！v/span></marquee>;</td>

</tr>

</table>

</form>

</body>

</html>

二、用表格及表单设计图2所示网页。（30分）

参考界面如图2o

请留下个人资料

□运动□阅读

您的爱好:

□听音乐口旅游

［全部重写

答：1.设计界面

请留下个人资料

姓名：

电话：

E-mail：

性别：。男。女

年龄：[2。^^v|

留言板:

您的爱好：口运动口阅读

□听音乐口旅游

2.程序源代码

<!DOCTYPEhtmlPUBLIC"-/AV3C//DTDXHTML1.0Transitional//ENH

"http:〃/TR/xhtmll/DTD/xhtmll-transitional.dtd”>

<htmlxmlns="http:〃/1999/xhtml”>

<head>

<metahttp-equiv=HContent-Type"content=ntext/html;charset=utf-8n/>

王战科网页设计大作业第二题

<styletype=ntext/css">

<!-

.STYLE2{font-size:18px;font-family:“黑体”;}

.STYLE3{font-size:18px}

.STYLE4{font-size:16px}

.STYLE5{font-size:18;}

->

</style>

</head>

<body>

<formid="formr,name=nforml"method=npost"action="">

<tablewidth=H723nborder=nOnalign=HcenterHbordercolor=n#OOOOFFnbgcolor=n#EBE9EDn>

<trxtdwidth=n717"height="432"valign="middle"xtablewidth=n754nborder=nO"

align="center”>

<trxtdwidth="748nheight="306nbgcolor=n#FFFFFFu><blockquote><blockquote>

<tablewidth=n537nheight="362nborder=nOHalign="center">

<tr>

<tdheight="358nvalign=nmiddlen><tablewidth=n574nborder=HOnalign="centerH>

<tr>

<tdwidth="568Hheight="30nvalign=Hbaseline"><divalign="center"

class="STYLE2"><u>请留下个人资料</u></div></td>

</tr>

<tr>

<tdxspanclass="STYLE3H>

<label></label>

</span>

<divalign=njustifynclass="STYLE3n>

<blockquote>

<blockquote>

<p>姓名：

<inputname="xmntype="text"id="xmnsize="12"maxlength="8"/>

</p>

</blockquote>

</blockquote>

</divx/td>

</tr>

<tr>

<tdxspanclass="STYLE3H>

<label></label>

</span>

<divalign—justify”class二"STYLE3”>

<blockquote>

<blockquote>

<p>电话：

<inputname="dh"type="text"id="dh"size=n16"maxlength="12"/>

</p>

</blockquote>

</blockquote>

</divx/td>

</tr>

<tr>

<tdxspanclass=nST¥LE3H>

<label></label>

</span>

<divalign="justifyHclass="STYLE3">

<blockquote>

<blockquote>

<palign="justify">E-mail：

<inputtype="textnname=',yjHid="yj”/>

</p>

</blockquote>

</blockquote>

</divx/td>

</tr>

<tr>

<tdheight二“24”>vspanclass="STYLE3n>

<label></label>

</span>

<blockquoteclass=HSTYLE3">

<blockquote>

<p>性别：

<inputtype="radio"name="radio"id="n"value="n"/>

男

<inputtype=Hradio"name=Hradionid="nv"value="nvn/>

女</p>

</blockquote>

</blockquote></td>

</tr>

<tr>

<td><spanclass="STYLE3">

<label></label>

</span>

<divalign="justify”class="STYLE3n>

<blockquote>

<blockquote>

<p>年龄：

<selectname="nl"id="nln>

<optionselected=nselectedn>20岁以下〈/option〉

<option>20至lj30岁</option>

<option>30至！J40岁</option>

<option>40岁以上</option>

</select>

</p>

</blockquote>

</blockquote>

</divx/td>

</tr>

<tr>

<tdheight=n209H><label>

<blockquote>

<blockquote>

<pclass二"STYLE5”>留言板：

<textareaname=nlybnid=',lybHcols=n30nrows=H5Hx/textarea>

</p>

<pclass="STYLE5”>您的爱好：

<inputtype=ncheckboxHname="ahlnid=nahl"/>

运动

<inputtype=',checkboxHname="ah2"id=nah2H/>

阅读v/p>

<blockquoteclass="STYLE4">

<blockquote>

<pclass=,,STYLE5n>

<inputtype=ncheckbox"name=uah3"id=nah3n/>

听音乐

<inputtype=,'checkboxMname=,,ah3Hid="ah4”/>

旅游v/p>

</blockquote>

</blockquote>

</blockquote>

</blockquote>

<spanclass="STYLE4n>

</label>

</spanx/td>

</tr>

</tablex/td>

</tr>

</table>

<P>

<label>

<divalign="centerH>

<divalign="centern>

<inputtype="submit"name="tijiao"id="tijiao”value="提交"/>

<inputtype="submitnname="chongxie"id="chongxie"value="全部重写”/>

</div>

</label>

</blockquote>

</blockquotex/td>

</tr>

</tablex/td>

</tr>

</table>

</form>

</body>

</html>

三、设计表单，并用JavaScript代码验证表单数据项。（50分）

参考界面如图30

请输入注册信息

图3

答：1.设计界面

请输入注册信息

请输入注册信息请输入注册信息

*用户名：

*密码:

*密码：I

确认密码:

速认密科：I

*E-Mail：*E-Mail：

请输入注册信息请输入注册信息

*用户名：*用户名：邛科

嗜码：*密利：|—一

通认密电3：嘴认密码:|******

*E-Mail：*E-Mail：abc

2.程序源代码

<script>

functionisEmptyO{

varfm=document.messagebook;

if(fm.username.value=="null"IIfm.username.value=="")

(

alert(“您忘记填写用户名了！)

returnfalse

)

else

if(fm.pswd.value=="null"IIfm.pswd.value=="")

{

alert("您忘记填写密码了！)

returnfalse

)

else

if(fm.email.value=="null"IIfm.email.value=="")

(

alert("您忘记填写EMAIL地址了！”)

returnfalse

)

else

if(fm.email.value.indexOf("@")==-l)

{alert(”没有\"@\"，邮件地址格式不正确”)

returnfalse

)

else

Welcome()

)

functionWelcome()

(

winl=open()

vara1=H<BR><BRxFONTsize=6color=blue><B><CENTER><I>n

vara2=n:</I>欢迎您访问本网站！</CENTER><B></FONT>"

varaaa=document.messagebook.usemame.value

win1.document.write(al+aaa+a2)

)

</script>

<head>

<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>

王战科网页设计大作业第三题

<styletype=ntext/css">

<!-

.STYLE1{font-size:18px}

.STYLE2{

font-size:24px;

font-weight:bold;

)

->

</style>

</head>

<body>

<formid="formr,name=nmessagebooknmethod="get"action』'"onSubmit="returnisEmpty()H>

<labelx/label>

<labelx/label>

<divalign="centern>

<tablewidth=n442nheight=n260">

<tr>

<tdcolspan=',2',xdivalign="center"class="STYLE2">

<p>请输入注册信息</p>

</divx/td>

</tr>

<tr>

<tdwidth="185"xdivalign="right”>*用户名:</divx/td>

<tdwidth="245"xlabel>

<divalign="left">

<inputname="usemame"type=ntext"id=Husername"maxlength=',12H/>

</div>

</labelx/td>

</tr>

<tr>

<tdxdivalign="right”>*密码：</div></td>

<tdxlabel>

<divalign="leftn>

<inputname=npswdntype=ntext"id=npswdnsize="18n/>

</div>

</labelx/td>

</tr>

<tr>

<tdxdivalign="righ

人人文库> 全部分类> 教育资料 > 辅导培训

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论