電子商務(wù)網(wǎng)頁(yè)設(shè)計(jì)與制作（慕課版）

第 1章 電子商務(wù)網(wǎng)頁(yè)設(shè)計(jì)與網(wǎng)站建設(shè)基礎(chǔ)
1．1　電子商務(wù)網(wǎng)頁(yè)設(shè)計(jì)基礎(chǔ)知識(shí)　2
1．1．1　認(rèn)識(shí)網(wǎng)站與網(wǎng)頁(yè)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．2
1．1．2　電子商務(wù)網(wǎng)站概述．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．2
1．1．3　電子商務(wù)網(wǎng)站的主要內(nèi)容和功能．．．．．．．．．．．．．．2
1．1．4　網(wǎng)頁(yè)常見(jiàn)布局結(jié)構(gòu)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．3
1．1．5　網(wǎng)頁(yè)的基本構(gòu)成元素．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．3
1．1．6　網(wǎng)頁(yè)常用術(shù)語(yǔ)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．4
1．1．7　網(wǎng)頁(yè)色彩搭配．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．4
1．1．8　HTML標(biāo)記語(yǔ)言．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．6
1．2　課堂案例：創(chuàng)建“宅家商城”網(wǎng)站　9
1．2．1　電子商務(wù)網(wǎng)站開(kāi)發(fā)流程．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．9
1．2．2　網(wǎng)站制作流程．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．10
1．2．3　Dreamweaver CS6工作界面．．．．．．．．．．．．．．．．．．．．．．．．12
1．2．4　創(chuàng)建本地站點(diǎn)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．13
1．2．5　編輯站點(diǎn)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．13
1．2．6　管理站點(diǎn)和站點(diǎn)文件夾．．．．．．．．．．．．．．．．．．．．．．．．．．．．．14
1．3　項(xiàng)目實(shí)訓(xùn)　15
1．3．1　賞析營(yíng)銷(xiāo)類電子商務(wù)網(wǎng)站．．．．．．．．．．．．．．．．．．．．．．．．．15
1．3．2　規(guī)劃并創(chuàng)建“婚紗網(wǎng)”站點(diǎn)．．．．．．．．．．．．．．．．．．．．17
1．4　課后練習(xí)　18
練習(xí)1：規(guī)劃燈飾照明電子商務(wù)網(wǎng)站．．．．．．．．．．．．．．．．．．18
練習(xí)2：創(chuàng)建“格什溫電器”站點(diǎn)．．．．．．．．．．．．．．．．．．．．．．18
1．5　技巧提升　19
1．站點(diǎn)命名規(guī)則．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．19
2．網(wǎng)頁(yè)設(shè)計(jì)師需要知道的網(wǎng)頁(yè)設(shè)計(jì)內(nèi)容．．．．．．．．．．19
3．網(wǎng)頁(yè)設(shè)計(jì)需要遵循的原則．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．19
4．網(wǎng)站設(shè)計(jì)時(shí)的色彩聯(lián)想．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．20
第　2章 使用Photoshop處理產(chǎn)品圖像
2．1　Photoshop基本操作　22
2．1．1　設(shè)置前景色與背景色．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．22
2．1．2　圖層的基本操作．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．22
2．1．3　裁剪并更改圖像尺寸．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．23
2．1．4　批處理圖像．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．24
2．2　課堂案例：調(diào)整產(chǎn)品圖像的亮度
與對(duì)比度　25
2．2．1　提高亮度與對(duì)比度．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．26
2．2．2　調(diào)整高光、陰影和中間調(diào)．．．．．．．．．．．．．．．．．．．．．．．．．26
2．2．3　增強(qiáng)亮度與暗度的對(duì)比．．．．．．．．．．．．．．．．．．．．．．．．．．．．．29
2．3　課堂案例：修飾產(chǎn)品圖像的瑕疵　30
2．3．1　矯正偏色．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．30
2．3．2　清除污漬．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．31
2．3．3　光滑材質(zhì)表面．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．32
2．3．4　增加金屬質(zhì)感．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．33
2．4　課堂案例：摳取并合成產(chǎn)品圖像　35
2．4．1　摳取簡(jiǎn)單背景．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．35
2．4．2　摳取復(fù)雜圖形．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．37
2．4．3　摳取毛發(fā)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．39
2．4．4　摳取半透明物體．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．40
2．5　項(xiàng)目實(shí)訓(xùn)　44
2．5．1　為原汁機(jī)更換背景．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．44
2．5．2　打造街拍圖像風(fēng)格．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．45
2．6　課后練習(xí)　46
練習(xí)1：為沙發(fā)更換背景．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．46
練習(xí)2：處理金屬材質(zhì)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．47
2．7　技巧提升　48
1．文字的應(yīng)用．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．48
2．使用調(diào)整圖層．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．48
第3章　使用Photoshop設(shè)計(jì)網(wǎng)頁(yè)元素
3．1　課堂案例：設(shè)計(jì)網(wǎng)頁(yè)橫幅廣告　50
3．1．1　制作通欄橫幅廣告．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．50
3．1．2　制作常規(guī)橫幅廣告．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．54
3．2　課堂案例：設(shè)計(jì)網(wǎng)頁(yè)海報(bào)　55
3．2．1　制作全屏輪播海報(bào)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．56
3．2．2　制作常規(guī)輪播海報(bào)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．60
3．3　課堂案例：設(shè)計(jì)產(chǎn)品推廣圖　63
3．3．1　制作橫向產(chǎn)品推廣圖．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．63
3．3．2　制作常規(guī)產(chǎn)品推廣圖．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．65
3．4　項(xiàng)目實(shí)訓(xùn)　66
3．4．1　設(shè)計(jì)化妝品橫幅廣告．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．66
3．4．2　設(shè)計(jì)洗衣機(jī)全屏海報(bào)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．67
3．5　課后練習(xí)　68
練習(xí)1：制作女包全屏輪播海報(bào)．．．．．．．．．．．．．．．．．．．．．．．．．．68
練習(xí)2：設(shè)計(jì)宅家商城海報(bào)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．69
3．6　技巧提升　70
1．網(wǎng)頁(yè)導(dǎo)航欄設(shè)計(jì)技巧．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．70
2．電子商務(wù)網(wǎng)頁(yè)元素設(shè)計(jì)注意事項(xiàng)．．．．．．．．．．．．．．．．．．70
第4章　使用Photoshop設(shè)計(jì)網(wǎng)站界面
4．1　課堂案例：制作“宅家商城”主頁(yè)　72
4．1．1　設(shè)計(jì)網(wǎng)頁(yè)頭部．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．73
4．1．2　網(wǎng)頁(yè)內(nèi)容設(shè)計(jì)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．77
4．1．3　網(wǎng)頁(yè)底部設(shè)計(jì)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．88
4．2　課堂案例：輸出“宅家商城”網(wǎng)站
主頁(yè)　90
4．2．1　創(chuàng)建切片．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．91
4．2．2　輸出切片．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．92
4．3　項(xiàng)目實(shí)訓(xùn)　93
4．3．1　制作“返場(chǎng)活動(dòng)”網(wǎng)頁(yè)效果圖．．．．．．．．．．．．．．．．93
4．3．2　設(shè)計(jì)“矮凳詳情頁(yè)”效果圖．．．．．．．．．．．．．．．．．．．．96
4．4　課后練習(xí)　98
練習(xí)1：設(shè)計(jì)“墨韻婚紗”網(wǎng)站首頁(yè)．．．．．．．．．．．．．．．．．．98
練習(xí)2：設(shè)計(jì)“燈具網(wǎng)主頁(yè)”效果圖．．．．．．．．．．．．．．．．．．99
4．5　技巧提升　100
1．網(wǎng)頁(yè)效果圖設(shè)計(jì)技巧．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．100
2．組合切片．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．100
3．直接輸出為HTML文件．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．100
第5章　使用Dreamweaver制作基礎(chǔ)網(wǎng)頁(yè)
5．1　課堂案例：制作“代金券說(shuō)明”網(wǎng)頁(yè)　102
5．1．1　創(chuàng)建網(wǎng)頁(yè)文檔．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．102
5．1．2　設(shè)置頁(yè)面屬性．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．103
5．1．3　添加文字．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．104
5．1．4　設(shè)置文字格式．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．104
5．1．5　添加水平線．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．107
5．1．6　保存、預(yù)覽和關(guān)閉網(wǎng)頁(yè)文檔．．．．．．．．．．．．．．．．．．108
5．2　課堂案例：美化“幫助中心”網(wǎng)頁(yè)　109
5．2．1　插入與編輯圖像．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．109
5．2．2　優(yōu)化圖像．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．111
5．2．3　創(chuàng)建鼠標(biāo)經(jīng)過(guò)圖像．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．112
5．2．4　插入Flash動(dòng)畫(huà)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．113
5．2．5　添加背景音樂(lè)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．114
5．3　課堂案例：網(wǎng)頁(yè)跳轉(zhuǎn)設(shè)計(jì)　115
5．3．1　認(rèn)識(shí)超鏈接．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．116
5．3．2　插入文字超鏈接．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．118
5．3．3　創(chuàng)建空鏈接．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．120
5．3．4　創(chuàng)建圖像超鏈接．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．120
5．3．5　創(chuàng)建圖像熱點(diǎn)超鏈接．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．121
5．3．6　創(chuàng)建錨點(diǎn)超鏈接．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．121
5．3．7　創(chuàng)建電子郵件超鏈接．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．122
5．3．8　創(chuàng)建外部超鏈接．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．123
5．3．9　創(chuàng)建腳本鏈接．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．123
5．4　項(xiàng)目實(shí)訓(xùn)　124
5．4．1　美化“酒店預(yù)訂”網(wǎng)頁(yè)．．．．．．．．．．．．．．．．．．．．．．．．．．124
5．4．2　為“墨韻”網(wǎng)頁(yè)設(shè)計(jì)網(wǎng)頁(yè)跳轉(zhuǎn)．．．．．．．．．．．．．．126
5．5　課后練習(xí)　128
練習(xí)1：制作“小兒郎學(xué)校簡(jiǎn)介”網(wǎng)頁(yè)．．．．．．．．．．．．128
練習(xí)2：制作“服裝”網(wǎng)頁(yè)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．128
5．6　技巧提升　129
1．添加日期．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．129
2．在CSS中定義超鏈接樣式a：link、a：visited、
a：hover、a：active的順序．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．129
3．刪除鏈接圖片上的藍(lán)色邊框．．．．．．．．．．．．．．．．．．．．．．．．130
4．設(shè)置鼠標(biāo)移動(dòng)到文字鏈接上改變文字
的大小或顏色．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．130
5．添加滾動(dòng)文字．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．130
6．1　課堂案例：布局“宅家商城”主頁(yè)　132
6．1．1　認(rèn)識(shí)CSS樣式．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．133
6．1．2　認(rèn)識(shí)Div+CSS布局模式．．．．．．．．．．．．．．．．．．．．．．．．．．．．133
6．1．3　Div+CSS布局模式的優(yōu)勢(shì)．．．．．．．．．．．．．．．．．．．．．．．．134
6．1．4　插入并編輯Div．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．135
6．1．5　創(chuàng)建與編輯CSS樣式．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．138
6．1．6　應(yīng)用CSS樣式．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．140
6．1．7　使用AP Div元素．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．143
6．2　課堂案例：制作“產(chǎn)品展示”部分　145
6．2．1　創(chuàng)建表格．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．147
6．2．2　調(diào)整表格結(jié)構(gòu)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．148
6．2．3　設(shè)置表格和單元格．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．149
6．2．4　在表格中插入內(nèi)容．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．151
6．3　項(xiàng)目實(shí)訓(xùn)　154
6．3．1　制作“歇山園林”網(wǎng)頁(yè)．．．．．．．．．．．．．．．．．．．．．．．．．．154
6．3．2　制作“花店”網(wǎng)頁(yè)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．155
6．4　課后練習(xí)　158
練習(xí)1：布局“墨韻婚紗”首頁(yè)．．．．．．．．．．．．．．．．．．．．．．．．158
練習(xí)2：布局“酒店預(yù)訂”網(wǎng)頁(yè)．．．．．．．．．．．．．．．．．．．．．．．．159
6．5　技巧提升　160
1．CSS樣式鏈接．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．160
2．批量設(shè)置AP　Div．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．160
3．導(dǎo)入表格數(shù)據(jù)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．160
7．1　課堂案例：制作“宅粉注冊(cè)”網(wǎng)頁(yè)　162
7．1．1　認(rèn)識(shí)表單．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．162
7．1．2　創(chuàng)建表單．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．163
7．1．3　插入表單對(duì)象．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．164
7．2　課堂案例：完善網(wǎng)頁(yè)行為效果　173
7．2．1　行為的基礎(chǔ)知識(shí)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．173
7．2．2　彈出窗口．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．175
7．2．3　打開(kāi)瀏覽器窗口．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．176
7．2．4　檢查表單．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．177
7．3　項(xiàng)目實(shí)訓(xùn)　179
7．3．2　制作“用戶注冊(cè)”網(wǎng)頁(yè)．．．．．．．．．．．．．．．．．．．．．．．．．．179
7．3．2　為網(wǎng)頁(yè)添加行為．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．180
7．4　課后練習(xí)　182
練習(xí)1：制作“寵物網(wǎng)注冊(cè)”頁(yè)面．．．．．．．．．．．．．．．．．．．．182
練習(xí)2：制作“學(xué)員注冊(cè)”網(wǎng)頁(yè)．．．．．．．．．．．．．．．．．．．．．．．．183
練習(xí)3：制作“登錄”頁(yè)面．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．183
7．5　技巧提升　184
8．1　課堂案例：制作“新品體驗(yàn)”網(wǎng)頁(yè)　186
8．1．1　認(rèn)識(shí)“資源”面板．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．187
8．1．2　創(chuàng)建庫(kù)文件．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．187
8．1．3　應(yīng)用庫(kù)文件．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．189
8．2　課堂案例：制作“宅家優(yōu)購(gòu)”頁(yè)面　190
8．2．1　創(chuàng)建模板．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．192
8．2．2　創(chuàng)建可編輯區(qū)域．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．192
8．2．3　應(yīng)用與管理模板．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．193
8．3　項(xiàng)目實(shí)訓(xùn)　196
8．3．1　利用“庫(kù)”快速制作“酒店預(yù)訂”
頁(yè)面?。?96
8．3．2　制作“婚紗詳情頁(yè)”網(wǎng)頁(yè)模板．．．．．．．．．．．．．．197
8．4　課后練習(xí)　199
練習(xí)1：制作“精品推廣”頁(yè)面．．．．．．．．．．．．．．．．．．．．．．．．199
練習(xí)2：制作“花店”網(wǎng)頁(yè)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．200
8．5　技巧提升　201
1．編輯已有的庫(kù)文件．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．201
2．更新庫(kù)文件．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．201
3．分離庫(kù)文件．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．201
4．創(chuàng)建重復(fù)區(qū)域．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．202
5．創(chuàng)建可選區(qū)域．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．202
6．創(chuàng)建可編輯的可選區(qū)域．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．202
4
目　錄
9．1　課堂案例：搭建動(dòng)態(tài)網(wǎng)站平臺(tái)　204
9．1．1　認(rèn)識(shí)動(dòng)態(tài)網(wǎng)頁(yè)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．204
9．1．2　動(dòng)態(tài)網(wǎng)頁(yè)常用的開(kāi)發(fā)語(yǔ)言．．．．．．．．．．．．．．．．．．．．．．204
9．1．3　動(dòng)態(tài)網(wǎng)頁(yè)的開(kāi)發(fā)流程．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．206
9．1．4　認(rèn)識(shí)Web服務(wù)器．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．207
9．1．5　安裝與配置IIS．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．207
9．1．6　使用Access創(chuàng)建數(shù)據(jù)表．．．．．．．．．．．．．．．．．．．．．．．．．．．209
9．1．7　創(chuàng)建與配置動(dòng)態(tài)站點(diǎn)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．210
9．1．8　創(chuàng)建數(shù)據(jù)源．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．212
9．2　課堂案例：制作“用戶登錄”
動(dòng)態(tài)網(wǎng)頁(yè)　214
9．2．1　創(chuàng)建記錄集．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．214
9．2．2　插入動(dòng)態(tài)表格．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．215
9．2．3　創(chuàng)建記錄集導(dǎo)航．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．216
9．2．4　插入記錄．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．217
9．2．5　刪除記錄．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．219
9．3　項(xiàng)目實(shí)訓(xùn)　219
9．3．1　制作“用戶登錄”網(wǎng)頁(yè)．．．．．．．．．．．．．．．．．．．．．．．．．．219
9．3．2　制作“發(fā)貨記錄”網(wǎng)頁(yè)．．．．．．．．．．．．．．．．．．．．．．．．．．221
9．4　課后練習(xí)　222
練習(xí)1：制作網(wǎng)站后臺(tái)系統(tǒng)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．223
練習(xí)2：制作“注冊(cè)”動(dòng)態(tài)頁(yè)面．．．．．．．．．．．．．．．．．．．．．．．．223
9．5　技巧提升　224
10．1　課堂案例：電子商務(wù)平臺(tái)網(wǎng)頁(yè)制作　226
10．1．1　目前主流的電子商務(wù)平臺(tái)．．．．．．．．．．．．．．．．．．．．226
10．1．2　電子商務(wù)平臺(tái)網(wǎng)頁(yè)制作要求和注意
事項(xiàng)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．228
10．2　課堂案例：使用圖片空間　229
10．2．1　進(jìn)入圖片空間的方法．．．．．．．．．．．．．．．．．．．．．．．．．．．．229
10．2．2　上傳圖像到圖片空間．．．．．．．．．．．．．．．．．．．．．．．．．．．．229
10．2．3　移動(dòng)空間圖像．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．231
10．2．4　刪除與替換空間圖像．．．．．．．．．．．．．．．．．．．．．．．．．．．．232
10．3　課堂案例：使用模塊裝修店鋪　233
10．3．1　認(rèn)識(shí)裝修模塊．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．234
10．3．2　裝修頁(yè)頭．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．234
10．3．3　裝修熱點(diǎn)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．236
10．3．4　裝修其他模塊．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．238
10．4　項(xiàng)目實(shí)訓(xùn)　240
10．4．1　裝修產(chǎn)品詳情頁(yè)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．240
10．4．2　裝修分類導(dǎo)航模塊．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．241
10．5　課后練習(xí)　242
練習(xí)1：裝修耳機(jī)店鋪?lái)?yè)頭．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．242
練習(xí)2：裝修耳機(jī)詳情頁(yè)．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．243
10．6　技巧提升　243
1．電商平臺(tái)店鋪首頁(yè)設(shè)計(jì)的注意事項(xiàng)．．．．．．．．．．．．243
2．電商平臺(tái)店鋪首頁(yè)布局的要點(diǎn)．．．．．．．．．．．．．．．．．．．．244
第9章　制作動(dòng)態(tài)網(wǎng)頁(yè)鏈接網(wǎng)站后臺(tái)
第　10章 電子商務(wù)平臺(tái)的網(wǎng)頁(yè)制作與上傳
11．1　實(shí)訓(xùn)目標(biāo)　246
11．2　專業(yè)背景　247
11．3　制作思路分析　247
11．4　準(zhǔn)備工作　248
11．4．1　站點(diǎn)規(guī)劃．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．248
11．4．2　素材收集．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．248
11．5　操作過(guò)程　248
11．5．1　使用Photoshop設(shè)計(jì)網(wǎng)頁(yè)效果圖．．．．．．．．．．．．248
11．5．2　使用Dreamweaver合成網(wǎng)頁(yè)．．．．．．．．．．．．．．．．．．．260
11．6　項(xiàng)目實(shí)訓(xùn)　266
11．6．1　制作“微觀多肉植物”網(wǎng)頁(yè)．．．．．．．．．．．．．．．．266
11．6．2　制作珠寶官網(wǎng)頁(yè)面．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．267
11．7　課后練習(xí)　269
練習(xí)1：制作“產(chǎn)品中心”頁(yè)面．．．．．．．．．．．．．．．．．．．．．．．．269
練習(xí)2：制作“聯(lián)系我們”頁(yè)面．．．．．．．．．．．．．．．．．．．．．．．．270
第　11章　綜合案例——綜合案例——制作墨韻箱包館網(wǎng)頁(yè)