Web個人網頁設計實驗報告.docx

鄭州輕工業(yè)學院Web前端設計網頁設計報告院系： 班級： 學號： 姓名： 時間： 設計報告網頁設計要求題目：設計一個不限內容、題材的個人網站，要求頁面數(shù)量不少于7個。具體要求1. 網頁內容詳實、科學、準確、積極、健康、活潑，網頁文字及相關鏈接無錯誤。2. 網頁文件及文件夾的命名符合要求，文件組織合理。1) 首頁源文件命名為：index.html。2) 文件夾image存放與網頁相關的圖片、動畫文件等。3) 說明文件Readme.txt內容包括：網頁創(chuàng)意及制作的簡單說明。3. 網頁設計整體設計思路清晰，網頁布局合理，風格明快、主題頁和其他子頁之間協(xié)調，主題分明、重點突出。欄目及版面設計，層次結構及鏈接結構明確，內容布局合理，圖畫運用得當，效果生動。4. 網頁上各主題和附加圖片、背景的色彩選配方案要注意做到：色彩柔和、搭配美觀、樸素大方，不應過分夸張，使視覺疲勞。5. 使用表格、框架、Css各布局一個頁面。6. 有自己創(chuàng)作的flash、JavaScript可加分。7. 文檔提交：電子稿與報告（電子稿網站、報告網頁創(chuàng)意及制作的簡單說明）。網頁主題及內容主題：在世界的各個角落，邂逅最美的你內容：一些著名的外國旅游、度蜜月勝地，感受當?shù)氐娘L土人情，體驗不一樣的異域風情。網頁創(chuàng)意因為自己本身特別喜歡旅游，喜歡嘗試不一樣的生活環(huán)境，和每個少女一樣，我也存在著一個和未來的另一半環(huán)游世界的夢，所以這次我的網頁是以“在世界的各個角落，邂逅最美的你”為主題展開制作，在實現(xiàn)這個環(huán)游世界的夢以前，提前感受下各國的風土人情。網頁制作的簡單說明通過主頁index可鏈接到 “馬爾代夫的藍色心情（Maerdaifu.html）、法國的紫色浪漫風情（French.html）、在雅典，我愿意帶你，走遍陽光灑過的地方（XILA.html）、行走在巴黎（BaLi.html）、巴塞羅那（Basailuona.html）、ReadMe（ReadMe.html）”，所有圖片都經過PS處理過。1.首頁（index.htm）：采用了CSS布局頁面。 1）創(chuàng)建了style1.css文件在style文件中。 2）插入的Div標簽有：date標簽，menu標簽，main標簽，make 標簽。 3）在代碼中插入了背景音樂。 4）menu標簽中分別設置了5個超級鏈接。 5）插入了AP Div1顯示歌詞、AP Div2滾動歌詞文字，并設 置了歌詞欄的“顯示-隱藏”。2. 馬爾代夫的藍色心情（Maerdaifu.html）：采用Spry選項卡式面 板+Ap層 布局。 1）采用spry選項卡式面板布局。 2）面板中設置了四個選項：馬爾代夫簡介+景點游玩及指南1+ 景點游玩及指南2+圖片欣賞。 3）設置了AP Div1 - AP Div14個層。 4）AP Div8插入了滾動歌詞，AP Div13插入滾動圖片。 5）在代碼中插入了背景音樂。3.法國的紫色浪漫風情（French.html）： 1）采用spry選項卡式面板布局。 2）面板中設置了五個選項：普羅旺斯簡介+活動+主角(1)+主角 (2)+圖片欣賞。 3）設置了AP Div2 - AP Div15幾個層。 4）AP Div15插入了滾動歌詞，AP Div12插入了滾動圖片。 5）在代碼中插入了背景音樂。4.在雅典，我愿意帶你，走遍陽光灑過的地方（XILA.html）： 1）采用表格布局。 2）表格中設置了3個模塊：伯羅奔尼撒半島(Peloponissos)+ 圣托里尼島(Santorini)+雅典(Athens)。 3）設置了AP Div2 - AP Div20幾個層。 4）在代碼中插入了背景音樂。5.行走在巴黎（BaLi.html）： 1）采用Ap層布局。 2）設置了AP Div1 - AP Div5幾個層。 3）AP Div2 設置為滾動圖片。 4）在代碼中插入了背景音樂。6.巴塞羅那（Basailuona.html）： 1）采用spry選項卡式面板布局。 2）設置了AP Div1 - AP Div5幾個層。 3）AP Div 3 設置為滾動圖片。 4）在代碼中插入了背景音樂。7.ReadMe（ReadMe.html）： 1）采用Ap層布局+表格布局。 2）設置了AP Div1 - AP Div2兩個層。 3）AP Div2 設置為滾動字幕，并插入了日期。心得 通過Web前端設計網頁設計的學習，我喜歡上了網頁設計，