浪漫婚紗攝影網(wǎng)站設(shè)計(jì)與實(shí)現(xiàn)的畢業(yè)論文

1、GDGM-QR-03-077-B/1 Guangdong College of Industry & Commerce 畢業(yè)綜合實(shí)踐報(bào)告Graduation Synthesis Practice Report 浪漫婚紗攝影網(wǎng)站設(shè)計(jì)與實(shí)現(xiàn)Design and implementation of romantic wedding photography website 將該封面替換為新的模版 系 別: 計(jì)算機(jī)工程系班 級(jí): 14計(jì)信2班學(xué)生姓名: 李琴濱學(xué) 號(hào): 1423219指導(dǎo)老師: 高學(xué)勤完成日期: 2017年5月1日指導(dǎo)教師評(píng)語(yǔ)：初評(píng)成績(jī)：指導(dǎo)教師簽名：年 月 日畢業(yè)綜合實(shí)踐（設(shè)計(jì)）評(píng)審小

2、組意見(jiàn)：終評(píng)成績(jī)：組長(zhǎng)簽章：年 月 日備注GDGM-QR-03-069-B/3畢業(yè)綜合實(shí)踐報(bào)告浪漫婚紗攝影網(wǎng)站設(shè)計(jì)與實(shí)現(xiàn)系 別： 計(jì)算機(jī)工程系 班 級(jí)： 14計(jì)信2班 學(xué)生姓名： 李琴濱 學(xué) 號(hào)： 1423219 指導(dǎo)老師： 高學(xué)勤 完成日期： 2017年5月2號(hào) 摘要在互聯(lián)網(wǎng)飛速發(fā)展的今天，網(wǎng)絡(luò)已成為人們生活中不可缺少的一部分，網(wǎng)站的發(fā)展的速度也非常之快。網(wǎng)站已經(jīng)可以展示企業(yè)形象、介紹產(chǎn)品和服務(wù)、體現(xiàn)企業(yè)發(fā)展戰(zhàn)略的重要途徑。所以在全球信息技術(shù)和互聯(lián)網(wǎng)經(jīng)濟(jì)的高速發(fā)展，更多人通過(guò)互聯(lián)網(wǎng)來(lái)豐富自己的生活和提高生活質(zhì)量、享受生活。浪漫婚紗攝影網(wǎng)站就是通過(guò)互聯(lián)網(wǎng)對(duì)外宣傳自己企業(yè)的攝影服務(wù)和宣傳企業(yè)的婚

3、紗品牌。，這樣就能很好向他人其他介紹企業(yè)不同美景的婚紗攝影，吸引更多人為了紀(jì)念兩個(gè)人的幸福的婚紗照來(lái)拍攝屬于自己的一系列套婚紗照，這樣就能達(dá)到了企業(yè)攝影的活動(dòng)服務(wù)等等。浪漫婚紗攝影網(wǎng)站通過(guò)Dreamweaver CS6制作網(wǎng)站，網(wǎng)站簡(jiǎn)潔大方，界面美觀簡(jiǎn)潔。，能讓用戶產(chǎn)生視覺(jué)上的放松。使用Photoshop處理圖像和制作logo等等，令圖片更加生動(dòng)逼真。網(wǎng)站添加了JavaScript特效和應(yīng)用jQuery特效，使得頁(yè)面更加生動(dòng)、活潑，富有感染力。使用div+css能夠使網(wǎng)站導(dǎo)航清晰，布局簡(jiǎn)單卻不單調(diào)，讓網(wǎng)頁(yè)能夠一目了然，方便快捷。關(guān)鍵詞：浪漫婚紗攝影網(wǎng)站 Dreamweaver CS6 Java

4、Script JQuery 目 錄（將正文中的標(biāo)題序號(hào)編碼方式重新修改為論文要求的格式，并更新目錄） TOC o 1-1 f h z t 標(biāo)題 2,1,標(biāo)題 3,1 HYPERLINK l _Toc480142991一、緒論 PAGEREF _Toc480142991 h 2HYPERLINK l _Toc480142992（1）婚紗攝影行業(yè)的現(xiàn)狀 PAGEREF _Toc480142992 h 2HYPERLINK l _Toc480142993（2）課題的來(lái)源 PAGEREF _Toc480142993 h 2HYPERLINK l _Toc480142994（3）課題的意義 PAGERE

5、F _Toc480142994 h 2HYPERLINK l _Toc480142995二、網(wǎng)站設(shè)計(jì)思想 PAGEREF _Toc480142995 h 3HYPERLINK l _Toc480142996（1）開發(fā)工具的選用 PAGEREF _Toc480142996 h 3HYPERLINK l _Toc4801429971.Dreamweaver CS6的簡(jiǎn)介 PAGEREF _Toc480142997 h 3HYPERLINK l _Toc4801429982.Adobe Photoshop cs6軟件的簡(jiǎn)介 PAGEREF _Toc480142998 h 3HYPERLINK l _

6、Toc480142999（2）Web技術(shù) PAGEREF _Toc480142999 h 4HYPERLINK l _Toc4801430001.HTML介紹 PAGEREF _Toc480143000 h 4HYPERLINK l _Toc4801430012.DIV+CSS PAGEREF _Toc480143001 h 5HYPERLINK l _Toc4801430023.JavaScript 介紹 PAGEREF _Toc480143002 h 5HYPERLINK l _Toc4801430034.JQuery PAGEREF _Toc480143003 h 6HYPERLINK

7、l _Toc480143004三、網(wǎng)站總體分析與設(shè)計(jì) PAGEREF _Toc480143004 h 6HYPERLINK l _Toc480143005（1）網(wǎng)站主題的設(shè)計(jì) PAGEREF _Toc480143005 h 6HYPERLINK l _Toc480143006（2）網(wǎng)站的需求分析 PAGEREF _Toc480143006 h 7HYPERLINK l _Toc480143007（3）總體布局 PAGEREF _Toc480143007 h 8HYPERLINK l _Toc480143008（4）網(wǎng)站風(fēng)格 PAGEREF _Toc480143008 h 9HYPERLINK

8、l _Toc480143009（5）設(shè)計(jì)思路 PAGEREF _Toc480143009 h 9HYPERLINK l _Toc480143010（6）網(wǎng)頁(yè)設(shè)計(jì)的配色風(fēng)格 PAGEREF _Toc480143010 h 9HYPERLINK l _Toc480143011四、網(wǎng)頁(yè)的制作與實(shí)現(xiàn) PAGEREF _Toc480143011 h 10HYPERLINK l _Toc480143012（1）首頁(yè)設(shè)計(jì) PAGEREF _Toc480143012 h 10HYPERLINK l _Toc4801430131.Logo的制作 PAGEREF _Toc480143013 h 12HYPERLI

9、NK l _Toc4801430142.頭部導(dǎo)航的設(shè)計(jì) PAGEREF _Toc480143014 h 13HYPERLINK l _Toc4801430153.圖片輪播的實(shí)現(xiàn) PAGEREF _Toc480143015 h 15HYPERLINK l _Toc4801430164.圖片的展示的不同效果 PAGEREF _Toc480143016 h 16HYPERLINK l _Toc4801430175.在線問(wèn)答的js效果 PAGEREF _Toc480143017 h 17HYPERLINK l _Toc4801430186.預(yù)定訂單的效果 PAGEREF _Toc480143018 h

10、 19HYPERLINK l _Toc480143019（2）婚紗禮服的子頁(yè)面露維婭婚紗、奈特麗婚紗、洛維思婚紗、HELLO魔鏡 PAGEREF _Toc480143019 h 20HYPERLINK l _Toc480143020（3）婚紗套系的子頁(yè)面大觀世界、石門公園、百萬(wàn)葵園、沙面美景 PAGEREF _Toc480143020 h 22HYPERLINK l _Toc480143021五、結(jié)束語(yǔ) PAGEREF _Toc480143021 h 23HYPERLINK l _Toc480143022致 謝 PAGEREF _Toc480143022 h 24HYPERLINK l _To

11、c480143023參考文獻(xiàn) PAGEREF _Toc480143023 h 25摘要在互聯(lián)網(wǎng)飛速發(fā)展的今天，網(wǎng)絡(luò)已成為人們生活中不可缺少的一部分，網(wǎng)站的發(fā)展的速度也非常之快。網(wǎng)站已經(jīng)可以展示企業(yè)形象、介紹產(chǎn)品和服務(wù)、體現(xiàn)企業(yè)發(fā)展戰(zhàn)略的重要途徑。所以在全球信息技術(shù)和互聯(lián)網(wǎng)經(jīng)濟(jì)的高速發(fā)展，更多人通過(guò)互聯(lián)網(wǎng)來(lái)豐富自己的生活和提高生活質(zhì)量、享受生活。浪漫婚紗攝影網(wǎng)站就是通過(guò)互聯(lián)網(wǎng)對(duì)外宣傳自己企業(yè)的攝影服務(wù)和宣傳企業(yè)的婚紗品牌。這樣就能很好向其他介紹企業(yè)不同美景的婚紗攝影，吸引更多人為了紀(jì)念兩個(gè)人的幸福的婚紗照來(lái)拍攝屬于自己的一系列套婚紗照，這樣就能達(dá)到了企業(yè)攝影的活動(dòng)服務(wù)等等。浪漫婚紗攝影網(wǎng)站通過(guò)D

12、reamweaver CS6制作網(wǎng)站，網(wǎng)站簡(jiǎn)潔大方，界面美觀簡(jiǎn)潔。讓用戶產(chǎn)生視覺(jué)上的放松。使用Photoshop處理圖像和制作logo等等，令圖片更加生動(dòng)逼真。網(wǎng)站添加了JavaScript特效和應(yīng)用jQuery特效，使得頁(yè)面更加生動(dòng)、活潑，富有感染力。使用div+css能夠使網(wǎng)站導(dǎo)航清晰，布局簡(jiǎn)單卻不單調(diào)，讓網(wǎng)頁(yè)能夠一目了然，方便快捷。關(guān)鍵詞：浪漫婚紗攝影網(wǎng)站 Dreamweaver CS6 JavaScript JQuery 目錄 TOC o 1-3 h z u HYPERLINK l _Toc480905744 錯(cuò)誤！超鏈接引用無(wú)效。畢業(yè)綜合實(shí)踐報(bào)告 PAGEREF _Toc480905

13、744 h 1 HYPERLINK l _Toc480905745 錯(cuò)誤！超鏈接引用無(wú)效。摘要 PAGEREF _Toc480905745 h 2 HYPERLINK l _Toc480905746 錯(cuò)誤！超鏈接引用無(wú)效。在互聯(lián)網(wǎng)飛速發(fā)展的今天，網(wǎng)絡(luò)已成為人們生活中不可缺少的一部分，網(wǎng)站的發(fā)展的速度也非常之快。網(wǎng)站已經(jīng)可以展示企業(yè)形象、介紹產(chǎn)品和服務(wù)、體現(xiàn)企業(yè)發(fā)展戰(zhàn)略的重要途徑。所以在全球信息技術(shù)和互聯(lián)網(wǎng)經(jīng)濟(jì)的高速發(fā)展，更多人通過(guò)互聯(lián)網(wǎng)來(lái)豐富自己的生活和提高生活質(zhì)量、享受生活。 PAGEREF _Toc480905746 h 2 HYPERLINK l _Toc480905747 錯(cuò)誤！超鏈接

14、引用無(wú)效。浪漫婚紗攝影網(wǎng)站就是通過(guò)互聯(lián)網(wǎng)對(duì)外宣傳自己企業(yè)的攝影服務(wù)和宣傳企業(yè)的婚紗品牌，這樣就能很好向他人介紹企業(yè)不同美景的婚紗攝影，吸引更多人為了紀(jì)念兩個(gè)人的幸福來(lái)拍攝屬于自己的一系列婚紗照，這樣就能達(dá)到了企業(yè)攝影的活動(dòng)服務(wù)等等。 PAGEREF _Toc480905747 h 2 HYPERLINK l _Toc480905748 錯(cuò)誤！超鏈接引用無(wú)效。浪漫婚紗攝影網(wǎng)站通過(guò)Dreamweaver CS6制作網(wǎng)站，網(wǎng)站簡(jiǎn)潔大方，界面美觀簡(jiǎn)潔，能讓用戶產(chǎn)生視覺(jué)上的放松。使用Photoshop處理圖像和制作logo等等，令圖片更加生動(dòng)逼真。網(wǎng)站添加了JavaScript特效和應(yīng)用jQuery特效

15、，使得頁(yè)面更加生動(dòng)、活潑，富有感染力。使用div+css使網(wǎng)站導(dǎo)航清晰，布局簡(jiǎn)單卻不單調(diào)，讓網(wǎng)頁(yè)能夠一目了然，方便快捷。 PAGEREF _Toc480905748 h 2 HYPERLINK l _Toc480905749 一、緒論 PAGEREF _Toc480905749 h 1 HYPERLINK l _Toc480905750 (一)婚紗攝影行業(yè)的現(xiàn)狀 PAGEREF _Toc480905750 h 1 HYPERLINK l _Toc480905751 (二)課題的來(lái)源 PAGEREF _Toc480905751 h 1 HYPERLINK l _Toc480905752 (三)課

16、題的意義 PAGEREF _Toc480905752 h 1 HYPERLINK l _Toc480905753 二、網(wǎng)站設(shè)計(jì)思想 PAGEREF _Toc480905753 h 2 HYPERLINK l _Toc480905754 (一)開發(fā)工具的選用 PAGEREF _Toc480905754 h 2 HYPERLINK l _Toc480905755 1.Dreamweaver CS6的簡(jiǎn)介 PAGEREF _Toc480905755 h 2 HYPERLINK l _Toc480905756 2.Adobe Photoshop cs61軟件的簡(jiǎn)介 PAGEREF _Toc480905

17、756 h 3 HYPERLINK l _Toc480905757 (二)Web技術(shù) PAGEREF _Toc480905757 h 3 HYPERLINK l _Toc480905758 1.HTML介紹 PAGEREF _Toc480905758 h 3 HYPERLINK l _Toc480905759 2.DIV+CSS PAGEREF _Toc480905759 h 4 HYPERLINK l _Toc480905760 3.JavaScript 介紹 PAGEREF _Toc480905760 h 5 HYPERLINK l _Toc480905761 4.JQuery PAGER

18、EF _Toc480905761 h 5 HYPERLINK l _Toc480905762 三、網(wǎng)站總體分析與設(shè)計(jì) PAGEREF _Toc480905762 h 6 HYPERLINK l _Toc480905763 (一)網(wǎng)站主題的設(shè)計(jì) PAGEREF _Toc480905763 h 6 HYPERLINK l _Toc480905764 (二)網(wǎng)站的需求分析 PAGEREF _Toc480905764 h 6 HYPERLINK l _Toc480905765 (三)總體布局 PAGEREF _Toc480905765 h 7 HYPERLINK l _Toc480905766 (四)

19、網(wǎng)站風(fēng)格5 PAGEREF _Toc480905766 h 8 HYPERLINK l _Toc480905767 (五)設(shè)計(jì)思路 PAGEREF _Toc480905767 h 8 HYPERLINK l _Toc480905768 (六)網(wǎng)頁(yè)設(shè)計(jì)的配色風(fēng)格5 PAGEREF _Toc480905768 h 8 HYPERLINK l _Toc480905769 四、網(wǎng)頁(yè)的制作與實(shí)現(xiàn) PAGEREF _Toc480905769 h 9 HYPERLINK l _Toc480905770 (一)首頁(yè)設(shè)計(jì) PAGEREF _Toc480905770 h 9 HYPERLINK l _Toc480

20、905771 1.Logo的制作 PAGEREF _Toc480905771 h 11 HYPERLINK l _Toc480905772 2.頭部導(dǎo)航的設(shè)計(jì) PAGEREF _Toc480905772 h 12 HYPERLINK l _Toc480905773 3.圖片輪播的實(shí)現(xiàn) PAGEREF _Toc480905773 h 13 HYPERLINK l _Toc480905774 4.圖片的展示的不同效果22 PAGEREF _Toc480905774 h 15 HYPERLINK l _Toc480905775 5.在線問(wèn)答的js效果 PAGEREF _Toc480905775 h

21、16 HYPERLINK l _Toc480905776 6.預(yù)定訂單的效果 PAGEREF _Toc480905776 h 17 HYPERLINK l _Toc480905777 (二)婚紗禮服的子頁(yè)面露維婭婚紗、奈特麗婚紗、洛維思婚紗、HELLO魔鏡 PAGEREF _Toc480905777 h 19 HYPERLINK l _Toc480905778 (三)婚紗套系的子頁(yè)面大觀世界、石門公園、百萬(wàn)葵園、沙面美景 PAGEREF _Toc480905778 h 20 HYPERLINK l _Toc480905779 五、結(jié)束語(yǔ) PAGEREF _Toc480905779 h 22 H

22、YPERLINK l _Toc480905780 參考文獻(xiàn) PAGEREF _Toc480905780 h 23 HYPERLINK l _Toc480905781 致 謝 PAGEREF _Toc480905781 h 24緒論婚紗攝影行業(yè)的現(xiàn)狀現(xiàn)存的攝影影樓一般由傳統(tǒng)照相館發(fā)展而來(lái)，從產(chǎn)生到成熟再到發(fā)展。上世紀(jì)八九十年代照相館遍布大街小巷，拍攝照片使用的是膠卷式照相機(jī)，拍攝成本相當(dāng)高，婚紗照的拍攝對(duì)很多家庭來(lái)說(shuō)還是奢侈品，自從數(shù)碼相機(jī)誕生以來(lái)，婚紗攝影的成本就大大降低，而拍攝婚紗照成為人人追求的時(shí)尚?，F(xiàn)代婚紗攝影風(fēng)格豐富和發(fā)展了傳統(tǒng)的拍攝風(fēng)格，傳統(tǒng)的拍攝風(fēng)格主要是室內(nèi)拍攝，而且還是使用簡(jiǎn)單

23、的背景布，洗出來(lái)的照片也大都是樣式簡(jiǎn)單，大同小異，如今，婚紗攝影拍攝采用了內(nèi)外景結(jié)合的拍攝風(fēng)格，拍攝場(chǎng)景也都是經(jīng)過(guò)精心布置的，拍攝效果更加完美且拍出來(lái)的照片更具有藝術(shù)性課題的來(lái)源隨著計(jì)算機(jī)技術(shù)的快速發(fā)展，婚紗攝影管理網(wǎng)絡(luò)化已成為企業(yè)影樓管理的必然選擇。而目前很多婚紗影樓并沒(méi)有走上網(wǎng)絡(luò)化管理道路，這就存在很多不足之處，如因人為因素導(dǎo)致數(shù)據(jù)丟失而給公司帶來(lái)很大的經(jīng)濟(jì)損失等，而通過(guò)婚紗影樓管理系統(tǒng)就可以提高工作效率，無(wú)論是給企業(yè)還是客戶都能帶來(lái)很大的便利。 隨著人們生活水平的不斷改善以及人們審美水平不斷提高，人們用更加挑剔的眼光來(lái)審視美，在20世紀(jì)20年代時(shí)，西式婚紗攝影就在中國(guó)閃亮登場(chǎng)，并以自己獨(dú)

24、特的魅力逐漸的滲透到中國(guó)的婚禮文化之中，新人穿戴婚紗西裝拍攝婚紗照，把那一刻的美好時(shí)光永遠(yuǎn)定格，寄托著婚姻的神圣與純潔。 90年代初期，內(nèi)地的婚紗影樓商界刮起了一股港臺(tái)風(fēng)。出于對(duì)美的追求，人們對(duì)拍攝新式婚紗照的激情更加高昂?；榧唽懻嬲詹粌H僅是裝飾外在的美麗，更是將夫妻兩人的最美好的記憶永遠(yuǎn)保存下來(lái)，回味一生。正因?yàn)槿绱?，婚紗產(chǎn)業(yè)則得以飛速發(fā)展。課題的意義Internet是世界上最大的計(jì)算機(jī)互聯(lián)網(wǎng)，作為一種先進(jìn)的信息檢索手段，以驚人的速度發(fā)展成為世界上最豐富的資源海洋，所以建設(shè)一個(gè)優(yōu)秀的網(wǎng)站對(duì)于企業(yè)來(lái)講相當(dāng)重要。隨著藝術(shù)照時(shí)代的興起，婚紗影樓行業(yè)也越來(lái)越遭到人們的重視，而傳統(tǒng)的婚紗影樓非但管理效

25、率底下，而且缺乏個(gè)性化精致服務(wù)，所以鑒于此，建設(shè)一個(gè)婚紗影樓網(wǎng)站是對(duì)消費(fèi)者必不可少的，婚紗影樓網(wǎng)站可以方便人們對(duì)婚紗攝影的了解，和方便對(duì)人們對(duì)婚紗的向往和追求，從而提高婚紗影樓的活動(dòng)等方面。增加一下對(duì)這個(gè)網(wǎng)站的實(shí)際功能的描述網(wǎng)站設(shè)計(jì)思想開發(fā)工具的選用Dreamweaver CS6的簡(jiǎn)介 Dreamweaver CS6是Macromedia 公司開發(fā)的可視化網(wǎng)頁(yè)設(shè)計(jì)工具，在一個(gè)集成的環(huán)境中創(chuàng)建管理網(wǎng)站及Internet應(yīng)用程序。并可用于網(wǎng)絡(luò)編程人員開發(fā)動(dòng)態(tài)網(wǎng)頁(yè)后臺(tái)程序。Dreamweaver也是一個(gè)可視化的網(wǎng)頁(yè)設(shè)計(jì)和網(wǎng)站管理工具，本網(wǎng)站開發(fā)以Dreamweaver為基本工具，從最簡(jiǎn)單的靜態(tài)文本網(wǎng)

26、頁(yè)開始，逐步加入文本、圖像、表格、排版、動(dòng)畫、框架、表單等Web元素，生成圖文并茂的網(wǎng)頁(yè)；然后將網(wǎng)站和數(shù)據(jù)庫(kù)以及服務(wù)器腳本結(jié)合在一起，制作出復(fù)雜的動(dòng)態(tài)網(wǎng)頁(yè)。Dreamweaver CS6可以輕而易舉地制作出跨操作系統(tǒng)平臺(tái)， 跨瀏覽器的充滿動(dòng)感的網(wǎng)頁(yè)， 是目前制作 Web 頁(yè)站點(diǎn), Web 頁(yè)和 Web應(yīng)用程序開發(fā)的理想工具。 Dreamweaver， Fireworks， Flash 被稱為網(wǎng)頁(yè)制作的“三劍客”，這三款工具相輔相承， 是制作網(wǎng)頁(yè)的最佳拍檔。Dreamweaver CS6工作區(qū)是非常靈活的。因此它可以適應(yīng)各種不同的工作風(fēng)格和使用水平。常用的Dreamweaver工作區(qū)組件有以下若

27、干種：文檔窗口可顯示當(dāng)前文檔，文檔的外觀和瀏覽器中看到的非常相似裝載器中包含一些打開和關(guān)閉常用檢查器和模板的按鈕。對(duì)象工具欄包含創(chuàng)建不同類型的對(duì)象（例如：圖像、表格和層等）的按鈕。屬性檢查器顯示選定對(duì)象的屬性?？旖莶藛慰梢允褂脩舢?dāng)前選擇或區(qū)域快速執(zhí)行某些命令。可固定的浮動(dòng)工具欄允許用戶將浮動(dòng)窗口、檢查器和工具欄組合在一個(gè)或多個(gè)選擇窗口中。Adobe Photoshop cs61軟件的簡(jiǎn)介Adobe Photoshop，簡(jiǎn)稱“PS”，是由Adobe Systems開發(fā)和發(fā)行的圖像處理軟件,是Adobe公司旗下最為出名的圖像處理軟件之一。從功能上看，Photoshop可分為圖像編輯、圖像合成、校色

28、調(diào)色及功能色效制作部分等。 圖像編輯是圖像處理的基礎(chǔ)，可以對(duì)圖像做各種變換如放大、縮小、旋轉(zhuǎn)、傾斜、鏡像、透視等；也可進(jìn)行復(fù)制、去除斑點(diǎn)、修補(bǔ)、修飾圖像的殘損等。圖像合成則是將幾幅圖像通過(guò)圖層操作、工具應(yīng)用合成完整的、傳達(dá)明確意義的圖像，這是美術(shù)設(shè)計(jì)的必經(jīng)之路；Photoshop提供的繪圖工具讓外來(lái)圖像與創(chuàng)意很好地融合。校色調(diào)色可方便快捷地對(duì)圖像的顏色進(jìn)行明暗、色偏的調(diào)整和校正，也可在不同顏色進(jìn)行切換以滿足圖像在不同領(lǐng)域如網(wǎng)頁(yè)設(shè)計(jì)、印刷、多媒體等方面應(yīng)用。特效制作在Photoshop中主要由濾鏡、通道及工具綜合應(yīng)用完成。包括圖像的特效創(chuàng)意和特效字的制作，如油畫、浮雕、石膏畫、素描等常用的傳統(tǒng)美

29、術(shù)技巧都可藉由Photoshop特效完成。Photoshop是目前最流行的圖形、圖像編輯設(shè)計(jì)軟件，在數(shù)碼影像處理、圖像編輯合成、廣告設(shè)計(jì)、封面設(shè)計(jì)、美術(shù)繪畫、網(wǎng)頁(yè)設(shè)計(jì)等領(lǐng)域都被廣泛地應(yīng)用。文字處理更加方便圖層集使圖層管理更有序。圖像的剪切和剪裁比較方便。所有工具的選項(xiàng)板會(huì)出現(xiàn)在工具選項(xiàng)欄工作區(qū)頂部，方便參數(shù)的設(shè)置?？梢苑奖愕赜寐窂嚼L畫，豐富的幾何形狀工具，通過(guò)選擇工具的不同工作模式，可創(chuàng)建路徑、幾何形狀或幾何填充區(qū)，使矢量繪圖功能得到了加強(qiáng)。Web技術(shù)HTML介紹HTML（Hyper Text Mark-up Language ）即超文本標(biāo)記語(yǔ)言，是 WWW 的描述語(yǔ)言。嚴(yán)格的來(lái)講， HTML

30、 不能算做一門編程語(yǔ)言， 因?yàn)樗鼪](méi)有自己的數(shù)據(jù)類型，也沒(méi)有分支、循環(huán)等控制結(jié)構(gòu)。它的設(shè)計(jì)簡(jiǎn)單，結(jié)構(gòu)靈活，允許在 Web 瀏覽器及其它兼容的應(yīng)用程序中顯示文本和圖像，并且文檔的某些部分可以成為超鏈接。 完成后把這些文檔保存為*. html 文件， 然后用瀏覽器打開。 HTML 是網(wǎng)絡(luò)的通用語(yǔ)言, 一種簡(jiǎn)單、 通用的全置標(biāo)記語(yǔ)言。它允許網(wǎng)頁(yè)制作人建立文本與圖片相結(jié)合的復(fù)雜頁(yè)面， 這些頁(yè)面可以被網(wǎng)上任何其他人瀏覽到，無(wú)論使用的是什么類型的電腦或?yàn)g覽器。HTML文本是由 HTML命令組成的描述性文本，HTML 命令可以說(shuō)明文字、 圖形、動(dòng)畫、聲音、表格、鏈接等。HTML的結(jié)構(gòu)包括頭部 (Head)、主

31、體 (Body) 兩大部分。頭部描述瀏覽器所需的信息，主體包含所要說(shuō)明的具體內(nèi)容。DIV+CSSDIV+CSS2是WEB設(shè)計(jì)標(biāo)準(zhǔn)，它是一種網(wǎng)頁(yè)的布局方法。與傳統(tǒng)中通過(guò)表格(table)布局定位的方式不同，它可以實(shí)現(xiàn)網(wǎng)頁(yè)頁(yè)面內(nèi)容與表現(xiàn)相分離。提起DIV+CSS組合，還要從XHTML說(shuō)起。XHTML是一種在HTML(標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言的子集)基礎(chǔ)上優(yōu)化和改進(jìn)的新語(yǔ)言，目的是基于XML應(yīng)用與強(qiáng)大的數(shù)據(jù)轉(zhuǎn)換能力，適應(yīng)未來(lái)網(wǎng)絡(luò)應(yīng)用更多的需求。CSS是層疊樣式表(Cascading Style Sheets)的縮寫，用于定義HTML元素的顯示形式，是W3C推出的格式化網(wǎng)頁(yè)內(nèi)容的標(biāo)準(zhǔn)技術(shù)。網(wǎng)頁(yè)設(shè)計(jì)者必須掌握的

32、技術(shù)之一。以下DIV+CSS的幾點(diǎn)優(yōu)勢(shì)：(1)能夠使代碼精簡(jiǎn)，使用div+css布局使代碼很是精簡(jiǎn)，css文件可以在網(wǎng)站的任意一個(gè)頁(yè)面進(jìn)行調(diào)用，避免了使用table表格修改部分頁(yè)面。(2)提升了網(wǎng)頁(yè)訪問(wèn)速度，div+css布局較傳統(tǒng)的Table布局比較，減少了許多代碼，其瀏覽訪問(wèn)速度自然得以提升，從而提升了網(wǎng)站的用戶體驗(yàn)度。(3)采用div-css布局的網(wǎng)站對(duì)于搜索引擎很是友好，簡(jiǎn)潔、結(jié)構(gòu)化的代碼更加有利于突出重點(diǎn)和適合搜索引擎抓取,有利于優(yōu)化網(wǎng)頁(yè)。(4)DIV+CSS更容易出現(xiàn)多種瀏覽器不兼容的問(wèn)題，主要原因是不同的瀏覽器對(duì)web標(biāo)準(zhǔn)默認(rèn)值不同。(5)網(wǎng)頁(yè)不喜歡一個(gè)頁(yè)面有太多的css代碼，影

33、響搜索引擎的收錄，所以采用外部調(diào)用的方式調(diào)用CSS是非常不錯(cuò)的方法。(6)CSS的極大優(yōu)勢(shì)表現(xiàn)在簡(jiǎn)潔的代碼，對(duì)于一個(gè)大型網(wǎng)站來(lái)說(shuō)，可以節(jié)省大量帶寬，而且眾所周知，搜索引擎喜歡清潔的代碼。 (7)采用CSS布局，同樣可以到達(dá)所想要的效果。如網(wǎng)站導(dǎo)航中的文字顏色變化、css下拉菜單等。JavaScript 介紹JavaScript3一種直譯式腳本語(yǔ)言，是一種動(dòng)態(tài)類型、弱類型、基于原型的語(yǔ)言，內(nèi)置支持類型。它的解釋器被稱為JavaScript引擎，為瀏覽器的一部分，廣泛用于客戶端的腳本語(yǔ)言，最早是在HTML（標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言下的一個(gè)應(yīng)用）網(wǎng)頁(yè)上使用，用來(lái)給HTML網(wǎng)頁(yè)增加動(dòng)態(tài)功能。JavaScrip

34、t是一種屬于網(wǎng)絡(luò)的腳本語(yǔ)言,已經(jīng)被廣泛用于Web應(yīng)用開發(fā),常用來(lái)為網(wǎng)頁(yè)添加各式各樣的動(dòng)態(tài)功能,為用戶提供更流暢美觀的瀏覽效果。通常JavaScript腳本是通過(guò)嵌入在HTML中來(lái)實(shí)現(xiàn)自身的功能的。（1）是一種解釋性腳本語(yǔ)言（代碼不進(jìn)行預(yù)編譯） （2）主要用來(lái)向HTML（標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言下的一個(gè)應(yīng)用）頁(yè)面添加交互行為。（3）可以直接嵌入HTML頁(yè)面，但寫成單獨(dú)的js文件有利于結(jié)構(gòu)和行為的分離。 （4） 跨平臺(tái)特性，在絕大多數(shù)瀏覽器的支持下，可以在多種平臺(tái)下運(yùn)行（如Windows、Linux、Mac、Android、iOS等）。Javascript腳本語(yǔ)言同其他語(yǔ)言一樣，有它自身的基本數(shù)據(jù)類型，表

35、達(dá)式和算術(shù)運(yùn)算符及程序的基本程序框架。Javascript提供了四種基本的數(shù)據(jù)類型和兩種特殊數(shù)據(jù)類型用來(lái)處理數(shù)據(jù)和文字。而變量提供存放信息的地方，表達(dá)式則可以完成較復(fù)雜的信息處理。JQueryjQuery5是一套跨瀏覽器的JavaScript庫(kù)，簡(jiǎn)化HTML與JavaScript之間的操作。由John Resig在2006年1月的BarCamp NYC上發(fā)布第一個(gè)版本。目前是由 Dave Methvin 領(lǐng)導(dǎo)的開發(fā)團(tuán)隊(duì)進(jìn)行開發(fā)。全球前10000個(gè)訪問(wèn)最高的網(wǎng)站中，有59%使用了jQuery，是目前最受歡迎的JavaScript庫(kù)。Query由美國(guó)人John Resig創(chuàng)建，至今已吸引了來(lái)自世界

36、各地的眾多javascript高手加入其team，包括來(lái)自德國(guó)的Jrn Zaefferer，羅馬尼亞的Stefan Petre等等。jQuery是繼prototype之后又一個(gè)優(yōu)秀的Javascript框架。特點(diǎn)：（1）動(dòng)態(tài)特效、通過(guò)插件來(lái)擴(kuò)展。（2）方便的工具 - 例如瀏覽器版本判斷。（3）漸進(jìn)增強(qiáng)、鏈?zhǔn)秸{(diào)用。 （4）多瀏覽器支持。網(wǎng)站總體分析與設(shè)計(jì)網(wǎng)站主題的設(shè)計(jì)規(guī)劃設(shè)計(jì)一個(gè)網(wǎng)站，首先遇到的問(wèn)題就是網(wǎng)頁(yè)定位的主題。一個(gè)網(wǎng)頁(yè)的主題決定了這個(gè)網(wǎng)站的主要風(fēng)格以及這個(gè)網(wǎng)站的主要內(nèi)容。所謂主題也就是網(wǎng)站的題材。至今，人們對(duì)于婚紗照的要求越來(lái)越高，所以在Internet上建設(shè)網(wǎng)站，不僅僅能夠提升公司形象

37、，加強(qiáng)客戶服務(wù)，而且還挖掘更多的潛在客戶，獲取更高的利潤(rùn)。隨著物質(zhì)和精神生活的提高，婚紗影樓網(wǎng)站是一種空間展示，它的設(shè)計(jì)不同于一般的作品，所以人們對(duì)它的需求越來(lái)越高，在互聯(lián)網(wǎng)上設(shè)計(jì)婚紗攝影網(wǎng)站會(huì)吸引很多顧客的潮流。所以以”浪漫婚紗攝影”作為網(wǎng)站的的主題。網(wǎng)站的需求分析在設(shè)計(jì)一個(gè)的網(wǎng)站時(shí)，第一件事就是確定建站目的，然后就是分析該網(wǎng)站功能需求，因?yàn)榫W(wǎng)站的功能強(qiáng)度決定了網(wǎng)站的規(guī)模以及投入費(fèi)用。所以設(shè)計(jì)網(wǎng)站之前要充分分析和確定這個(gè)網(wǎng)站需要實(shí)現(xiàn)什么功能和什么效果，這樣才能沒(méi)有浪費(fèi)精力和財(cái)力。所以 主要功能分析的設(shè)計(jì)的分為以下幾點(diǎn)來(lái)設(shè)計(jì)整個(gè)網(wǎng)站：品牌：企業(yè)網(wǎng)站形象就是企業(yè)的招牌，顧客可以快速了解一個(gè)企業(yè)的

38、實(shí)力以及服務(wù)等信息，最好的途徑就是訪問(wèn)該公司的網(wǎng)站，所以網(wǎng)站建設(shè)的美麗和豐富直接關(guān)系到企業(yè)的在消費(fèi)者心中的形象產(chǎn)品/服務(wù)的展示：人們?cè)L問(wèn)網(wǎng)站的主要意圖就是更加深入的了解該公司的產(chǎn)品和服務(wù)等信息，該婚紗攝影網(wǎng)站的主要功能就是將公司的產(chǎn)品、服務(wù)等充分地展示給顧客，從而可以讓顧客從多方面，多角度地了解到諸如不同婚紗照的價(jià)位、最新優(yōu)惠活動(dòng)等信息，這樣可以吸引顧客的喜歡和心動(dòng)！客戶在線服務(wù)：通過(guò)網(wǎng)站可以很方便快捷地為顧客提供在線服務(wù)和幫助信息，如免費(fèi) 咨詢等，同時(shí)顧客也可以通過(guò)網(wǎng)上留言的方式提交自己的問(wèn)題，然后由公司人員進(jìn)行回應(yīng)。動(dòng)態(tài)新聞發(fā)布：網(wǎng)站是一個(gè)龐大信息庫(kù)，作為一個(gè)強(qiáng)有力的宣傳工具企業(yè)可以通過(guò)網(wǎng)

39、站隨時(shí)發(fā)布一些有利于宣傳企業(yè)形象、顧客服務(wù)和促進(jìn)銷售的企業(yè)新聞動(dòng)態(tài)、產(chǎn)品相關(guān)信息等。 總體布局浪漫婚紗攝影網(wǎng)站首頁(yè)聯(lián)系我們婚紗禮服婚紗作品外景展示婚紗套系婚紗視頻石門公園沙面美景百萬(wàn)葵園大觀世界HELLO魔鏡奈特麗婚紗洛維思婚紗露維婭婚紗網(wǎng)站風(fēng)格5設(shè)計(jì)一個(gè)網(wǎng)站，首先是將網(wǎng)站規(guī)定一個(gè)整體的風(fēng)格：簡(jiǎn)潔、時(shí)尚、浪漫等，一個(gè)網(wǎng)站的整體風(fēng)格會(huì)給人們帶來(lái)視覺(jué)享受，減少視覺(jué)疲憊感。但是風(fēng)格也必須與網(wǎng)站的主題相符，信息網(wǎng)站所對(duì)應(yīng)的應(yīng)該是簡(jiǎn)潔的風(fēng)格。所以作為一個(gè)資源信息網(wǎng)，我認(rèn)為頁(yè)面必須是簡(jiǎn)潔明了，文字簡(jiǎn)短易懂，讓用戶在瀏覽時(shí)能夠用最短的時(shí)間獲取最有用的信息。設(shè)計(jì)特征：首先用DIV+CSS將首頁(yè)整個(gè)頁(yè)面布局好，

40、設(shè)計(jì)網(wǎng)頁(yè)的基本框架網(wǎng)站頂部放上導(dǎo)航，而且將導(dǎo)航固定，隨時(shí)跳轉(zhuǎn)頁(yè)面。不必拉到對(duì)頂端再跳轉(zhuǎn)。網(wǎng)站整體風(fēng)格以白藍(lán)紅為主要色，堅(jiān)持三色原則。頁(yè)面文字醒目，字體規(guī)格統(tǒng)一，尺寸分配不夸張。按鈕為淺色背景色設(shè)計(jì)思路功能突出：一個(gè)網(wǎng)站的頁(yè)面要整潔明目，各種功能要顯現(xiàn)出來(lái)，主要體現(xiàn)在登錄窗口還有導(dǎo)航欄上。統(tǒng)一整體：網(wǎng)站的整體性統(tǒng)一使人不會(huì)在瀏覽時(shí)有障礙感，能夠清晰的瀏覽整個(gè)網(wǎng)頁(yè)的布局。用色協(xié)調(diào)：協(xié)調(diào)的用色使人不會(huì)感覺(jué)到視覺(jué)疲憊，能夠長(zhǎng)時(shí)間的停留和瀏覽。形象突出：突出自身行業(yè)的特點(diǎn)，還有自家主要的資源，使瀏覽者能夠針對(duì)性的尋找。交互式強(qiáng)：不會(huì)僅僅停留在頁(yè)面上的文字?jǐn)⑹?，?nèi)置交流功能使能夠靈活的溝通。網(wǎng)頁(yè)設(shè)計(jì)的配色

41、風(fēng)格5 HYPERLINK :/baike.baidu /view/37967.htm t _blank 色彩是藝術(shù)表現(xiàn)的要素之一。在網(wǎng)頁(yè)設(shè)計(jì)中， HYPERLINK :/baike.baidu /view/282148.htm t _blank 設(shè)計(jì)師根據(jù)和諧、均衡和重點(diǎn)突出的原則，將不同的色彩進(jìn)行組合搭配來(lái)構(gòu)成美麗的頁(yè)面。 根據(jù)色彩對(duì)人們心理的影響，合理地加以運(yùn)用。個(gè)人博客網(wǎng)主要靠黑色、白色和灰色來(lái)讓網(wǎng)頁(yè)更加和諧簡(jiǎn)潔，一目了然。網(wǎng)頁(yè)的制作與實(shí)現(xiàn)首頁(yè)設(shè)計(jì)Logo的制作Logo的psd制作1，首先在ps軟件先新建220 X 46畫布，搜索比較合適的小圖片，用ps軟件摳出雙心的圖標(biāo)。雙心的圖標(biāo)作

42、為一個(gè)圖層，然后用比較有Blackadder ITC的字體制作具有代表性的小logo L&M，L&M的logo是“浪漫”的拼音縮寫的。L&M又作為一個(gè)圖層，接下來(lái)“廣州浪漫婚紗攝影”作為一個(gè)圖層，“十大杰出影樓”作為一個(gè)圖層，幾個(gè)圖層形成了一個(gè)完整的Logo.之后保存為.png格式的圖片。頭部導(dǎo)航的設(shè)計(jì) 網(wǎng)站的每一個(gè)頁(yè)面的頭部導(dǎo)航的都是一樣的，頭部導(dǎo)航要設(shè)計(jì)是固定在屏幕的頂部，要隨著頁(yè)面的滾動(dòng)，頂部導(dǎo)航不會(huì)消失，導(dǎo)航還是會(huì)在頁(yè)面的頂部。 導(dǎo)航設(shè)計(jì)還有二級(jí)導(dǎo)航，在網(wǎng)站上鼠標(biāo)經(jīng)過(guò)“婚紗禮服” 婚紗套系”就會(huì)出現(xiàn)二級(jí)導(dǎo)航的目錄.頭部導(dǎo)航的div代碼 網(wǎng)站首頁(yè) 聯(lián)系我們 婚紗作品 婚紗禮服 露維婭婚紗

43、 奈特麗婚紗 洛維思婚紗 HELLO魔鏡 外景展示 婚紗套系 大觀世界 石門公園 百萬(wàn)葵園 沙面美景 婚紗視頻 最新活動(dòng)資訊 固定導(dǎo)航條的css代碼如下.headwidth: 100%;height: 65px;background-color: #C3A67A;position: fixed; z-index: 999; 圖片輪播的實(shí)現(xiàn) 目標(biāo)：實(shí)現(xiàn)幾張圖片的自動(dòng)輪播的效果5。為了實(shí)現(xiàn)這種效果，要用jQuery的插件和JavaScript的實(shí)現(xiàn)代碼來(lái)實(shí)現(xiàn)的。div+css的代碼如下。 先引入jQuery的插件和JavaScript文件 css的實(shí)現(xiàn)代碼.clearfix:after conte

44、nt: .; display: block; height: 0; clear: both; visibility: hidden;.clearfix zoom:1;imgborder:0.focuswidth:100%;height:500px;position:relative;margin-top:60px;margin-bottom: 30px;.f426x240width:100%;height:500px;.f426x240 imgwidth:110%;height:500px.rslideswidth:100%;position:relative;list-style:none;

45、padding:0.rslides_navheight:65px;width:40px;position:absolute;-webkit-tap-highlight-color:rgba(0,0,0,0); top:50%;left:0;opacity:0.5;text-indent:-9999px;overflow:hidden; text-decoration:none;background:url(./images/i.png) no-repeat 0 0px;margin-top:-40px;.rslides_nav:activeopacity:1.0.rslides_nav.nex

46、tleft:auto;background-position:-27px 0px;right:0.rslides_tabsmargin:12px auto;clear:both;text-align:center.rslides_tabs lidisplay:inline;float:none;_float:left;*float:left;margin-right:5px.rslides_tabs atext-indent:-9999px;overflow:hidden;-webkit-border-radius:15px;-moz-border-radius:15px;border-rad

47、ius:15px;background:rgba(0,0,0, .2);background:#DDD;display:inline-block;_display:block;*display:block;width:9px;height:9px.rslides_tabs .rslides_here abackground:rgba(0,0,0, .6);background:#390圖片的展示的不同效果2 了解更多 奈特麗婚紗在線問(wèn)答的js效果在網(wǎng)頁(yè)中設(shè)計(jì)代碼中有6條問(wèn)答的信息，但是想在在首頁(yè)中設(shè)計(jì)固定的寬度只顯示3條信息，但是這顯示三條信息是設(shè)計(jì)代碼的6條信息的其中，只是讓信息不斷的去跳動(dòng)

48、讓人們可以看到。而且信息要不斷的去跳動(dòng)。所以需要用js設(shè)計(jì)來(lái)實(shí)現(xiàn)這個(gè)效果。可以查看所有的問(wèn)答信息嗎，還是只能看3條，請(qǐng)做出進(jìn)一步說(shuō)明 $(function() var items=$(ul#answer_item li).length; if (items3) setInterval(function() var e=$(ul#answer_item li:first); var height=e.outerHeight()+px; var bak=e.clone(); e.animate(marginTop:-=+height,function() e.remove(); bak.appendTo(ul#answer_item); ); ,2000); ); 預(yù)定訂單的效果把這個(gè)小圖標(biāo)固定在頁(yè)面的旁邊，然后點(diǎn)擊后會(huì)跳出預(yù)定的訂單，這種效果用jQuery可以去實(shí)現(xiàn)，實(shí)現(xiàn)的步驟就是首先要隱藏訂單信息，如果點(diǎn)擊要出現(xiàn)訂單信息，用jQuery中fadeIn，接著設(shè)計(jì)訂單中用x的小圖標(biāo)再一次隱藏訂單信息，用jQuery中fadeOut的去實(shí)現(xiàn)。 提交訂單 x 您的姓名： 號(hào)碼： 聯(lián)系Q Q： 訂單要求： function order(par) $(#submit).fadeIn(1500)