《Web應(yīng)用開發(fā)》課件-03 旅游休閑網(wǎng)頁

本章簡介：旅游業(yè)蓬勃發(fā)展，旅游網(wǎng)站也隨之變得頗為火熱。根據(jù)旅游公司的市場定位和產(chǎn)品特點，旅游休閑網(wǎng)站也表現(xiàn)出了不同的類型和特色。本章以多個主題的旅游休閑網(wǎng)頁為例，講解了旅游休閑網(wǎng)頁的設(shè)計方法和制作技巧。15旅游休閑網(wǎng)頁課堂學習目標了解旅游休閑網(wǎng)頁的功能和特色了解旅游休閑網(wǎng)頁的類別和內(nèi)容掌握旅游休閑網(wǎng)頁的設(shè)計流程掌握旅游休閑網(wǎng)頁的布局構(gòu)思掌握旅游休閑網(wǎng)頁的制作方法15.1旅游休閑網(wǎng)頁概述隨著居民生活水平的日益提高，業(yè)余生活的豐富多彩，旅游已成為人們休閑、娛樂的首選方式。此起彼伏的旅游熱潮，使旅游行業(yè)的生意蒸蒸日上。而通過互聯(lián)網(wǎng)來宣傳自已又成為旅游行業(yè)的一項重要舉措。因此，越來越多的旅游網(wǎng)站建立起來，豐富多彩的內(nèi)容不僅為旅游者提供了了解外界及旅行社情況的窗口，而且也為旅行社提供了網(wǎng)上報名、網(wǎng)上預(yù)定平臺。良好的交流環(huán)境使得旅游行業(yè)獲取更多的用戶需求成為可能，也為尋找更好的旅游產(chǎn)品提供了良好的契機。15.2滑雪運動網(wǎng)頁案例分析案例設(shè)計案例制作案例分析滑雪是一項既浪漫又刺激的體育運動。旅游健身滑雪是適應(yīng)現(xiàn)代人們生活、文化需求而發(fā)展起來的大眾性健身運動。旅游健身滑雪是出于娛樂、健身的目的，男女老幼均可在雪場上輕松、愉快地滑行，飽享滑雪運動的無窮樂趣。本例是為滑雪運動裝備公司設(shè)計制作的網(wǎng)頁，目的是宣傳滑雪運動、展示和銷售滑雪裝備。在網(wǎng)頁設(shè)計中要體現(xiàn)出健身滑雪運動的驚險和優(yōu)美。在設(shè)計制作過程中，將導航條放在頁面的最上方，方便滑雪愛好者瀏覽信息。用圖片將上方的導航條與中心的信息聯(lián)系在一起，在突出頁面宣傳主體的同時，起到承上啟下的作用。下方文字和圖片巧妙編排，講解了一些滑雪常識和最新資訊。整個頁面設(shè)計體現(xiàn)出了滑雪運動的健康、動感、時尚的特質(zhì)。本例將使用表格按鈕布局網(wǎng)頁，使用CSS樣式設(shè)置表格、單元格的背景圖像和邊線效果。使用屬性面板改變文字的顏色、大小和字體。使用屬性面板設(shè)置單元格的高度和圖像的邊距。效果圖案例設(shè)計15.3戶外運動網(wǎng)頁案例分析案例設(shè)計案例制作戶外休閑運動可以擁抱自然，同時因其多數(shù)帶有探險性，屬于極限和亞極限運動，所以具有挑戰(zhàn)自我，培養(yǎng)個人毅力、團隊合作精神，提高野外生存能力的運動。因此，戶外休閑運動已經(jīng)成為人們娛樂、休閑和提升生活質(zhì)量的一種新的生活方式。本例是為戶外休閑運動俱樂部設(shè)計的網(wǎng)頁界面。該網(wǎng)頁主要的功能是宣傳戶外休閑運動，并不定期地組織網(wǎng)友活動。網(wǎng)頁的設(shè)計要體現(xiàn)出戶外休閑運動的挑戰(zhàn)性和刺激性。在設(shè)計制作過程中，將戶外山地車運動作為背景，表現(xiàn)出了自然的美麗和運動的魅力。導航欄放在頁面的最上方，愛好者可以方便地瀏覽戶外休閑運動的各種出行方式和相關(guān)知識。中央是戶外休閑運動的簡單介紹和一些論壇活動、戶外興趣，能加深人們的印象；底部是不同的戶外休閑運動和簡單介紹，方便人們對其進行了解和參與。整個頁面設(shè)計簡潔直觀，使瀏覽者有希望參與其中的沖動。案例分析本例將使用頁面屬性設(shè)置頁面文字大小、顏色、頁面邊距和頁面標題。使用表格按鈕布局網(wǎng)頁。使用圖像按鈕插入圖像，制作導航條效果。使用屬性面板改變單元格的對齊方式、寬度和高度。使用CSS樣式制作單元格背景效果、單元格邊框、文字的大小、顏色及文字的行距。效果圖案例設(shè)計15.4瑜珈休閑網(wǎng)頁案例分析案例設(shè)計案例制作瑜伽運用了一個古老而易于掌握的方法來提高人們生理、心理、情感和精神方面的能力，是一種達到身體、心靈與精神和諧統(tǒng)一的運動形式。本例是為瑜珈休閑健身俱樂部設(shè)計制作的網(wǎng)頁，本俱樂部主要針對的客戶是熱衷于健身、減肥、減壓，改變亞健康狀態(tài)的人群。網(wǎng)頁設(shè)計上希望能體現(xiàn)出瑜伽運動的健康與活力。在設(shè)計制作過程上，整個頁面以雅致甜美的粉紅色為基調(diào)，表現(xiàn)出柔和、溫馨的氛圍。清晰明確的導航欄設(shè)計與人物圖片相結(jié)合，體現(xiàn)出瑜伽這項古老運動的現(xiàn)代氣息，令瀏覽者的視覺和身心感受到健康自然的安定，體現(xiàn)出在練習瑜珈時的優(yōu)美空間與環(huán)境。中心與右下方的內(nèi)容區(qū)域?qū)銟凡康幕顒雍桶才胚M行了詳細的介紹，使瀏覽更加便捷、快速。整個頁面的設(shè)計充分體現(xiàn)出了瑜伽運動心靈與精神的和諧統(tǒng)一。案例分析本例將使用頁面屬性命令改變背景顏色、頁面文字大小、顏色、頁邊距和頁面標題效果。使用鼠標經(jīng)過圖像按鈕制作導航條效果。使用屬性面板改變單元格的高度、寬度、對齊方式及背景顏色。使用CSS樣式命令制作單元格背景圖像、文字的顏色、大小及行距的顯示效果。效果圖案例設(shè)計課堂練習—休閑生活網(wǎng)頁使用“頁面屬性”命令，改變頁面字體、大小、顏色、背景圖像和頁邊距效果；使用“CSS樣式”面板，制作單元格背景、文字顏色和行距效果；使用“屬性”面板，改變單元格的高度和寬度。效果圖課后習題—橄欖球運動網(wǎng)頁使用“頁面屬性”