網(wǎng)頁制作實驗報告

PAGEPAGE2武漢工業(yè)學院2009-2010學年第二學期《網(wǎng)站開發(fā)工具》課程報告網(wǎng)站主題：輕松一下——美麗の100%學院計算機與信息工程系專業(yè)信息管理與信息系統(tǒng)班級09級信管二班學號090502229姓名鐘雅婷指導教師林菁2010年6月10日網(wǎng)站主題內容及總體結構描述。1.·1網(wǎng)站主題：網(wǎng)站的總的主題是輕松一夏，主要的想法來自于想讓人在炎炎夏日看到我們的網(wǎng)頁時有一種輕松、愉悅的心情。1·2總體結構：首頁大概包含了我們四個人做的音樂、美食、旅游以及夏季護膚這四個不同子頁的主要內容，依據(jù)我們的不同特點插入了圖片，背景色等。然后通過導航條分別鏈接到四個子頁上。網(wǎng)頁設計思路和過程論述。2·1設計思路：我負責的是夏季護膚方面。本網(wǎng)頁中用到了Flash、圖像、框架集、導航條的設置應用、表單網(wǎng)頁、表單的嵌套等。首先用一個Flash做網(wǎng)頁的第一頁，起到歡迎的作用。然后鏈接到第二頁上，第二頁相當于整個網(wǎng)頁的目錄，上插有導航條，分別鏈接到第三還有第四頁上。2·2設計過程：2·2·1子頁——Flash頁的設計過程：打開Dreamweaver的主界面新建一個HTML頁。選擇插入/媒體/Flash(F)插入一個Flash2·2·2二級子頁——框架集的設計過程：（1）打開Dreamweaver的主界面，點擊文件、新建，出現(xiàn)新建網(wǎng)頁對話框。（2）在新建網(wǎng)頁對話框中，選擇：類別：框架頁，框架集：垂直拆分，并點擊創(chuàng)建。出現(xiàn)框架標簽對話框。修改/框架頁/拆分上框架對左邊的框架進行拆分然后分別通過頁面屬性/背景圖像插入背景圖。選擇插入/圖像對象/導航條添加導航條，并設置鼠標滑過圖片改變。如圖（a）所示：(a)（6）選擇插入/標簽/HTML/bgsound/瀏覽進行背景音樂的添加。如圖(b)所示：(b)（7）選擇行為/轉到URL/瀏覽鏈接，將Flash頁鏈接到這一頁上。（8）保存全部。2·2·3二級子頁——food的設計過程：（1）繪制布局單元格。如圖（c）所示：(c)（2）選取所需部分進行文字編輯，剩余部分填充圖片。并在該頁底部設置返回鏈接，連接到框架頁。（3）將框架頁中的food導航條鏈接到本頁。（4）在瀏覽器中預覽，再根據(jù)需要調整大小，然后保存。2·2·4二級子頁——sport的設計過程：用布局表格對網(wǎng)頁進行布局再填充相應的內容,如圖（d）所示(d)（2）在瀏覽器中預覽，再根據(jù)需要調整大小，并在該頁底部設置返回鏈接，連接到框架頁。（3）將框架頁中的sport導航條鏈接到本頁，然后保存。3、結論和總結：通過本次實驗，我充分的領會到了DW的方便。也更加熟練的掌握了對它的的使用，學會了一些以前并不知道的知識如，如何才能在插入背景音樂的時候不要背景音樂的圖標，如何讓視屏在單擊以后再鏈接到子頁上而不是直接自動跳過去等。還學會了如何將以前課堂上學到的網(wǎng)頁制作的基本知識串連起來對網(wǎng)頁進行設計、處理。在一次又一次誤刪，被空白頁覆蓋等等的困難與失敗