網(wǎng)頁(yè)設(shè)計(jì)作業(yè)_第1頁(yè)
網(wǎng)頁(yè)設(shè)計(jì)作業(yè)_第2頁(yè)
網(wǎng)頁(yè)設(shè)計(jì)作業(yè)_第3頁(yè)
網(wǎng)頁(yè)設(shè)計(jì)作業(yè)_第4頁(yè)
網(wǎng)頁(yè)設(shè)計(jì)作業(yè)_第5頁(yè)
已閱讀5頁(yè)，還剩6頁(yè)未讀， 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說(shuō)明：本文檔由用戶(hù)提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡(jiǎn)介

《網(wǎng)頁(yè)設(shè)計(jì)》大作業(yè)

專(zhuān)業(yè)：化學(xué)工程與工藝學(xué)院:化學(xué)工程學(xué)院學(xué)號(hào):0120920390311姓名：王戰(zhàn)科

（以下題目文檔要求：①設(shè)計(jì)界面②程序源代碼）

一、設(shè)計(jì)網(wǎng)頁(yè)，用滾動(dòng)字幕顯示為：“武漢理工大學(xué)歡迎您！二（20分）

（要求文字上、下、左、右交替滾動(dòng)）

參考界面如圖lo

武漢理工大學(xué)歡迎您!

答：1.設(shè)計(jì)界面

武漢理工大專(zhuān)

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

比］以中-L人子隊(duì)足1心1

t學(xué)歡迎您！

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>王戰(zhàn)科網(wǎng)頁(yè)設(shè)計(jì)大作業(yè)第一題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”>武漢理工大學(xué)歡迎您！v/span></marquee>v/td>

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

<spanclass="STYLE4”>武漢理工大學(xué)歡迎您！</span>v/marquee>v/td>

</tr>

<tr>

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

<spanclass="STYLE4">武漢理工大學(xué)歡迎您！</span></marquee>v/td>

<tdxmarqueedirection="right"behavior=nscroll">

<spanclass="STYLE4”>武漢理工大學(xué)歡迎您！v/span></marquee>;</td>

</tr>

</table>

</form>

</body>

</html>

二、用表格及表單設(shè)計(jì)圖2所示網(wǎng)頁(yè)。（30分）

參考界面如圖2o

請(qǐng)留下個(gè)人資料

□運(yùn)動(dòng)□閱讀

您的愛(ài)好:

□聽(tīng)音樂(lè)口旅游

［全部重寫(xiě)

答：1.設(shè)計(jì)界面

請(qǐng)留下個(gè)人資料

姓名：

電話(huà)：

E-mail：

性別：。男。女

年齡：[2。^^v|

留言板:

您的愛(ài)好：口運(yùn)動(dòng)口閱讀

□聽(tīng)音樂(lè)口旅游

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/>

王戰(zhàn)科網(wǎng)頁(yè)設(shè)計(jì)大作業(yè)第二題

<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>請(qǐng)留下個(gè)人資料</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>電話(huà)：

<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”>您的愛(ài)好：

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

運(yùn)動(dòng)

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

閱讀v/p>

<blockquoteclass="STYLE4">

<blockquote>

<pclass=,,STYLE5n>

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

聽(tīng)音樂(lè)

<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="全部重寫(xiě)”/>

</div>

</label>

</blockquote>

</blockquotex/td>

</tr>

</tablex/td>

</tr>

</table>

</form>

</body>

</html>

三、設(shè)計(jì)表單，并用JavaScript代碼驗(yàn)證表單數(shù)據(jù)項(xiàng)。（50分）

參考界面如圖30

請(qǐng)輸入注冊(cè)信息

圖3

答：1.設(shè)計(jì)界面

請(qǐng)輸入注冊(cè)信息

請(qǐng)輸入注冊(cè)信息請(qǐng)輸入注冊(cè)信息

*用戶(hù)名：

*密碼:

*密碼：I

確認(rèn)密碼:

速認(rèn)密科：I

*E-Mail：*E-Mail：

請(qǐng)輸入注冊(cè)信息請(qǐng)輸入注冊(cè)信息

*用戶(hù)名：*用戶(hù)名：邛科

嗜碼：*密利：|—一

通認(rèn)密電3：嘴認(rèn)密碼:|******

*E-Mail：*E-Mail：abc

2.程序源代碼

<script>

functionisEmptyO{

varfm=document.messagebook;

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

(

alert(“您忘記填寫(xiě)用戶(hù)名了！)

returnfalse

)

else

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

{

alert("您忘記填寫(xiě)密碼了！)

returnfalse

)

else

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

(

alert("您忘記填寫(xiě)EMAIL地址了！”)

returnfalse

)

else

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

{alert(”沒(méi)有\(zhòng)"@\"，郵件地址格式不正確”)

returnfalse

)

else

Welcome()

)

functionWelcome()

(

winl=open()

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

vara2=n:</I>歡迎您訪(fǎng)問(wèn)本網(wǎng)站！</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"/>

王戰(zhàn)科網(wǎng)頁(yè)設(shè)計(jì)大作業(yè)第三題

<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>請(qǐng)輸入注冊(cè)信息</p>

</divx/td>

</tr>

<tr>

<tdwidth="185"xdivalign="right”>*用戶(hù)名:</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. 本站所有資源如無(wú)特殊說(shuō)明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶(hù)所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁(yè)內(nèi)容里面會(huì)有圖紙預(yù)覽，若沒(méi)有圖紙預(yù)覽就沒(méi)有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫(kù)網(wǎng)僅提供信息存儲(chǔ)空間，僅對(duì)用戶(hù)上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對(duì)用戶(hù)上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請(qǐng)與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶(hù)因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

評(píng)論

0/150

提交評(píng)論