個(gè)人網(wǎng)站設(shè)計(jì)與制作課程設(shè)計(jì)

1、精選優(yōu)質(zhì)文檔-傾情為你奉上 計(jì)算機(jī)系10網(wǎng)絡(luò)班指導(dǎo)老師：金秋樂(lè)設(shè)計(jì)：齊致遠(yuǎn) 靜態(tài)網(wǎng)頁(yè) 個(gè)人網(wǎng)站設(shè)計(jì)與制作 專心-專注-專業(yè)課 程 名：靜態(tài)網(wǎng)頁(yè)實(shí)驗(yàn)課題：個(gè)人網(wǎng)站設(shè)計(jì)與制作實(shí)驗(yàn)要求：靜態(tài)網(wǎng)頁(yè)，至少包含主頁(yè)，日志， 相冊(cè)，留言板，個(gè)人資料制作準(zhǔn)備：確定網(wǎng)站主題風(fēng)格，網(wǎng)站結(jié)構(gòu)，顏色搭配，搜集素材。制作環(huán)境：Adobe Dreamweaver CS4指導(dǎo)老師：金秋樂(lè)老師 主頁(yè)頁(yè)面1、馬鞍山即使天氣預(yù)報(bào)代碼<iframe src=" " width="245" height="110" marginwidth="0"

2、marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="No" allowTransparency="true" （允許透明=“真”）></iframe> 2、訪客記錄代碼<div id="apDiv2"></div><p><td width="383" rowspan="2">

3、;<center> <span class="df">您是第</span><span class="STYLE16"><script src="" language="JavaScript" charset="gb2312"></script> </span><span class="df">位來(lái)訪客</span><span class="STYLE16

4、"><span class="df">。</span></span></center3、 時(shí)間代碼用到了JavaScript腳本語(yǔ)言4、 前期圖片美化、裁剪多次用到photoshopCS45、 多次用到Map 鏈接日志頁(yè)面1、日志頁(yè)面用到Spry選項(xiàng)卡式面板 參數(shù)為默認(rèn) 2、“日志名”居左，“推薦”居右3、每篇日志中的每個(gè) “上一篇”和“下一篇”和“返回日志列表”都是真實(shí)有效的，規(guī)格參數(shù)都一樣1、在日志里加入了媒體元素，*.swf游戲和*.flv視頻 媒體元素的Html鏈接 目標(biāo)均設(shè)置為_(kāi)blank，方便返回主頁(yè)面。

5、相冊(cè)頁(yè)面1、 相冊(cè)的建立 用到了 Fireworks CS4 很方便的建立了整個(gè)相冊(cè)2、 相冊(cè)封面借助PS統(tǒng)一了風(fēng)格3、 每個(gè)相片的頁(yè)面也都能進(jìn)入其他頁(yè)面，例如 下一頁(yè)，前一頁(yè)，留言板，音樂(lè)4、相冊(cè) Dear Family 用到了行為 <map name="Map6" id="Map6"> <area shape="rect" coords="53,31,154,108" href="#" onclick="MM_popupMsg('對(duì)不起，您暫時(shí)沒(méi)有訪問(wèn)權(quán)，

6、')" /></map>5、相冊(cè) before love 用到鼠標(biāo)經(jīng)過(guò)圖像 音樂(lè)頁(yè)面1、歌詞的顯示和歌曲的滾動(dòng) 都用到了Marquee語(yǔ)句，本頁(yè)面還利用行為 播放聲音 代碼如下div align="center"><span class="粗1">正在播放</span><span class="Blue1" onfocus="MM_controlSound('play','document.CS40','Downl

7、oad/胡彥斌 - 閃亮的日子.mp3')"> <marquee behavior="scroll" direction="left" scrollamount="3" loop="-1" scrolldelay="300" height="50" onmouseout="start()" onmouseover="stop()"> <p> <span class="STY

8、LE1"> <span class="STYLE3" onfocus="MM_controlSound('play','document.CS96','Music/胡彥斌 - 閃亮的日子.mp3')"> <img src="pic/mus/hu.jpg" name="Image37" width="25" height="25" border="0" id="Ima

9、ge37" /> 胡彥斌閃亮的日子</span></span></p> </marquee> </span></div>（詳見(jiàn)日志：滾動(dòng)文字Marquee屬性及參數(shù)設(shè)置）2、 多次用到Spry菜單欄來(lái)顯示歌曲 ul.MenuBarVerticalmargin: 0; /控制菜單欄與上下表格的距離padding: 0; /控制內(nèi)邊距，相對(duì)于margin外邊距l(xiāng)ist-style-type: none;font-size: 100%;cursor: default; /是默認(rèn)的小箭頭指向width: 8em;

10、/控制菜單欄之間的寬度ul.MenuBarVertical ulwidth: 6.2em; /控制二級(jí)菜單的可視寬度，但不是二級(jí)菜單的實(shí)際寬度（不太好描述， 結(jié)合下 一注釋和實(shí)際操作更好理解_）ul.MenuBarVertical ul liwidth: 6.4em; / 這個(gè)才是控制二級(jí)菜單的寬度，如果這個(gè)width 設(shè)置為8em,上一個(gè)width還是6.2em，這個(gè)二級(jí)菜單的實(shí)際寬度為8em，但可以看到寬6.4em的界面，剩下1.6em的透明界面，但是二級(jí)菜單的右邊框還是顯示在另一菜單上。隨筆頁(yè)面隨筆頁(yè)面利用表格和圖片做出種筆記本的感覺(jué)，只是在表格里設(shè)置背景圖像repeat-y 出現(xiàn)點(diǎn)小問(wèn)

11、題。分享頁(yè)面1、Spry選項(xiàng)卡式面板2、 電子書(shū)籍下載用到下載鏈接 3、 游戲分享插入了*swf 格式 小游戲 Html 目標(biāo)設(shè)置為_(kāi)blank方便返回主頁(yè)面好友頁(yè)面之前沒(méi)有設(shè)置這個(gè)頁(yè)面，是想放一些外鏈的，做了好久發(fā)現(xiàn)不是很美觀就換做這個(gè)好友秀頁(yè)面了本來(lái)是想把同學(xué)做的網(wǎng)站連在一起，那樣好像也算是一個(gè)班級(jí)的網(wǎng)站，可惜沒(méi)連上留言板頁(yè)面1、 鼠標(biāo)經(jīng)過(guò)圖像2、 Marquee語(yǔ)句控制的向上滾動(dòng)的寄語(yǔ)3、 用到表單，文本域，按鈕，單選框4、這只是個(gè)留言板的靜態(tài)模擬，期待能做出動(dòng)態(tài)的留言板。資料頁(yè)面簡(jiǎn)單的表格布局，一直在思考漂亮點(diǎn)的模式，可是一直沒(méi)想到只好用這個(gè)簡(jiǎn)單的模式了制作總結(jié)：1、 在做網(wǎng)站前要養(yǎng)成建站點(diǎn)在站點(diǎn)里操作的習(xí)慣。2、 在制作網(wǎng)站的過(guò)程中大量用到表格，掌握了表格的嵌套，拆分，添加，刪除。3、 在制作網(wǎng)站的過(guò)程中運(yùn)用到CSS樣式