內(nèi)容簡介

 本書針對零基礎(chǔ)的讀者，用實例引導讀者深入學習，采取“HTML基礎(chǔ)知識→HTML5高級技術(shù)→用CSS美化網(wǎng)頁→網(wǎng)頁布局和JavaScript→綜合案例實戰(zhàn)”的模式，深入淺出地講解網(wǎng)頁制作的各項技術(shù)及實戰(zhàn)技能。

本書第1篇主要講解HTML入門知識、網(wǎng)頁文檔結(jié)構(gòu)、網(wǎng)頁中的文本和圖像、建立超鏈接、創(chuàng)建表格和表單等內(nèi)容；第2篇主要講解HTML5快速入門、HTML5中的多媒體、使用HTML5繪制圖形等內(nèi)容；第3篇主要講解CSS概述與基本語法、美化網(wǎng)頁字體與段落、美化網(wǎng)頁圖片、美化網(wǎng)頁背景與邊框、美化表格和表單樣式、美化超鏈接和鼠標指針、控制網(wǎng)頁導航菜單的樣式等內(nèi)容；第4篇主要講解CSS+DIV盒子的浮動與定位、網(wǎng)頁布局剖析與制作、JavaScript和jQuery、經(jīng)典的網(wǎng)頁動態(tài)特效案例等；第5篇主要講解制作企業(yè)門戶類網(wǎng)頁、制作在線購物類網(wǎng)頁、制作移動設(shè)備類網(wǎng)頁；在DVD光盤中贈送了豐富的資源，諸如本書實例源代碼、教學幻燈片、本書精品教學視頻、88個實用類網(wǎng)頁模板、精選的JavaScript實例、HTML5標記速查手冊、CSS屬性速查表、JavaScript函數(shù)速查手冊、CSS+DIV布局賞析案例、精彩網(wǎng)站配色方案賞析、網(wǎng)頁樣式與布局案例賞析、Web前端工程師常見面試題等資料。

本書適合任何想學習網(wǎng)頁設(shè)計的人員，無論您是否從事計算機相關(guān)行業(yè)，是否接觸過網(wǎng)頁設(shè)計，通過本書的學習均可快速掌握網(wǎng)頁的制作方法和技巧。

 

前言

“實戰(zhàn)從入門到精通”系列圖書是專門為初學者量身定做的一套學習用書，由劉玉紅策劃，千谷網(wǎng)絡(luò)科技實訓中心的高級講師編著，整套書涵蓋高效辦公、網(wǎng)站開發(fā)、數(shù)據(jù)庫設(shè)計等方面。整套書具有以下特點。

前沿科技

無論是網(wǎng)站建設(shè)、數(shù)據(jù)庫設(shè)計，還是HTML、CSS，我們都精選較為前沿或者用戶群最大的領(lǐng)域推進，幫助讀者認識和了解最新動態(tài)。

權(quán)威的作者團隊

組織國家重點實驗室和資深應用專家聯(lián)手編寫本套圖書，融合豐富的教學經(jīng)驗與優(yōu)秀的管理理念。

學習型案例設(shè)計

以技術(shù)的實際應用過程為主線，全程采用圖解和同步多媒體結(jié)合的教學方式，生動、直觀、全面地剖析使用過程中的各種應用技能，降低難度并提升學習效率。

為什么要寫這樣一本書

目前，HTML、CSS和JavaScript是網(wǎng)頁制作和設(shè)計的黃金搭檔。特別是HTML5的出現(xiàn)，大大減輕了前端開發(fā)者的工作量，降低了開發(fā)成本。目前學習和關(guān)注網(wǎng)頁制作的人越來越多，而很多網(wǎng)頁制作和設(shè)計的初學者都苦于找不到一本通俗易懂、容易入門和案例實用的參考書。通過本書的案例實訓，學生可以很快上手流行的工具，提高職業(yè)能力，從而幫助解決公司與學生的雙重需求問題。

本書特色

 零基礎(chǔ)入門

無論您是否從事計算機相關(guān)行業(yè)，是否接觸過網(wǎng)頁制作和設(shè)計，都能從本書中找到最佳起點。

 超多、實用、專業(yè)的范例和項目

本書在編排上緊密結(jié)合深入學習網(wǎng)頁制作技術(shù)的先后順序，從HTML的基本概念開始，逐步深入學習各種應用技術(shù)，側(cè)重實戰(zhàn)技能，使用簡單易懂的實際案例進行分析和操作指導，讓讀者輕松閱讀，操作起來有章可循。

 隨時檢測自己的學習成果

每章首頁中，均提供了學習要點，以指導讀者重點學習及學后檢查。

大部分章節(jié)最后的“跟我練練手”板塊，均根據(jù)本章內(nèi)容精選而成，讀者可以隨時檢測自己的學習成果和實戰(zhàn)能力，做到融會貫通。

 細致入微、貼心提示

本書在各章中使用了“注意”“提示”“技巧”等小欄目，使讀者在學習過程中更清楚地了解相關(guān)操作、理解相關(guān)概念，并輕松掌握各種操作技巧。

 專業(yè)創(chuàng)作團隊和技術(shù)支持

本書由千谷網(wǎng)絡(luò)科技實訓中心提供技術(shù)支持。您在學習過程中遇到任何問題，可加入QQ群221376441進行提問，專業(yè)人員會在線答疑。

“網(wǎng)頁制作和設(shè)計”學習最佳途徑

本書以學習“網(wǎng)頁制作和設(shè)計”的最佳制作流程來分配章節(jié)，從最初的HTML基本概念開始講解，然后講解HTML5新技術(shù)、CSS美化網(wǎng)頁技術(shù)、網(wǎng)頁布局和JavaScript等，并在最后的項目實戰(zhàn)環(huán)節(jié)特意補充了3個綜合案例的制作過程，以便進一步提高讀者的實戰(zhàn)技能。

 

超值光盤

 全程同步教學錄像

涵蓋本書所有知識點，詳細講解每個實例和項目的過程及技術(shù)關(guān)鍵點，使讀者能比看書更輕松地掌握書中所有的網(wǎng)頁制作和設(shè)計知識，而且擴展的講解部分能使您得到比書中更多的收獲。

 超多容量王牌資源大放送

贈送大量王牌資源，包括書中案例源代碼、教學幻燈片、本書精品教學視頻、88個實用類網(wǎng)頁模板、精選的JavaScript實例、HTML5標記速查手冊、CSS屬性速查表、JavaScript函數(shù)速查手冊、CSS+DIV布局賞析案例、精彩網(wǎng)站配色方案賞析、網(wǎng)頁樣式與布局案例賞析、Web前端工程師常見面試題等。

讀者對象

沒有任何網(wǎng)頁設(shè)計基礎(chǔ)的初學者。

有一定的HTML和CSS基礎(chǔ)，想精通網(wǎng)頁制作和設(shè)計的人員。

有一定的HTML和CSS基礎(chǔ)，沒有項目經(jīng)驗的人員。

正在進行畢業(yè)設(shè)計的學生。

大專院校及培訓學校的老師和學生。

創(chuàng)作團隊

本書由劉玉紅和蒲娟編寫，參加編寫的人員還有劉玉萍、周佳、付紅、李園、郭廣新、侯永崗、王攀登、劉海松、孫若淞、王月嬌、包慧利、陳偉光、胡同夫、梁云梁和周浩浩。在編寫過程中，我們盡可能地將最好的講解呈現(xiàn)給讀者，但也難免有疏漏和不妥之處，敬請不吝指正。若您在學習中遇到困難或疑問，或有何建議，可寫信至信箱357975357@qq.com。

 

                                                                    編　者

目錄

第1篇　HTML基礎(chǔ)知識

第1章　HTML入門知識

1.1　網(wǎng)頁與網(wǎng)站 4

1.1.1　什么是網(wǎng)頁與網(wǎng)站 4

1.1.2　網(wǎng)頁基本構(gòu)成元素 5

1.2　HTML的基本概念 6

1.2.1　什么是HTML 6

1.2.2　HTML的發(fā)展歷程 6

1.2.3　HTML頁面的整體結(jié)構(gòu) 7

1.3　使用瀏覽器查看源文件 8

1.4　大神解惑 9

1.5　跟我練練手 9

第2章　網(wǎng)頁文檔結(jié)構(gòu)

2.1　HTML文件基本結(jié)構(gòu) 12

2.2　HTML5基本標記詳解 12

2.2.1　文檔類型說明 12

2.2.2　HTML標記 13

2.2.3　頭標記 13

2.2.4　網(wǎng)頁的主體標記body 15

2.2.5　頁面注釋標記 16

2.3　HTML5語法的變化 16

2.3.1　標記不再區(qū)分大小寫 17

2.3.2　允許屬性值不使用引號 17

2.3.3　允許部分屬性值的屬性省略 17

2.4　網(wǎng)頁文件的編寫方法 18

2.4.1　使用記事本手工編寫網(wǎng)頁 18

2.4.2　使用Dreamweaver CC編寫HTML文件 19

2.5　符合W3C標準的HTML5網(wǎng)頁 20

2.6　大神解惑 21

2.7　跟我練練手 22

第3章　網(wǎng)頁中的文本和圖像

3.1　在網(wǎng)頁中添加文本 24

3.1.1　普通文本的添加 24

3.1.2　特殊字符文本的添加 24

3.1.3　特殊文本的添加 26

3.2　文本排版 27

3.2.1　換行標記 27

3.2.2　段落標記 28

3.2.3　標題標記 28

3.3　文字列表 29

3.3.1　建立無序列表 29

3.3.2　建立有序列表 30

3.3.3　建立不同類型的無序列表 30

3.3.4　建立不同類型的有序列表 31

3.3.5　建立嵌套列表 31

3.3.6　自定義列表 32

3.4　網(wǎng)頁中的圖像 32

3.4.1　插入圖像 32

3.4.2　設(shè)置圖像的寬度和高度 34

3.4.3　設(shè)置圖像的提示文字 35

3.4.4　將圖片設(shè)置為網(wǎng)頁背景 36

3.4.5　排列圖像 36

3.5　圖文并茂房屋裝飾裝修網(wǎng)頁 37

3.6　在線購物網(wǎng)站產(chǎn)品展示效果 38

3.7　大神解惑 39

3.8　跟我練練手 40

第4章　建立超鏈接

4.1　網(wǎng)頁超鏈接的概念 42

4.1.1　什么是網(wǎng)頁超鏈接 42

4.1.2　超鏈接中的URL 42

4.1.3　超鏈接的URL類型 43

4.2　建立網(wǎng)頁超鏈接 43

4.2.1　創(chuàng)建超文本鏈接 43

4.2.2　創(chuàng)建圖片鏈接 44

4.2.3　創(chuàng)建下載鏈接 46

4.2.4　使用相對路徑和絕對路徑 46

4.2.5　設(shè)置以新窗口顯示超鏈接頁面 47

4.2.6　設(shè)置電子郵件鏈接 48

4.3　浮動框架 49

4.4　精確定位熱點區(qū)域 50

4.5　使用錨鏈接制作電子書閱讀網(wǎng)頁 54

4.6　大神解惑 56

4.7　跟我練練手 56

第5章　創(chuàng)建表格和表單

5.1　表格的基本結(jié)構(gòu) 58

5.2　創(chuàng)建表格 59

5.2.1　創(chuàng)建普通表格 59

5.2.2　創(chuàng)建帶有標題的表格 60

5.2.3　定義表格的邊框類型 60

5.2.4　定義表格的表頭 61

5.2.5　設(shè)置表格背景 61

5.2.6　設(shè)置單元格背景 62

5.2.7　合并單元格 63

5.2.8　排列單元格中的內(nèi)容 66

5.2.9　設(shè)置表格的行高與列寬 66

5.3　創(chuàng)建完整的表格 67

5.4　認識表單 68

5.5　表單基本元素的使用 69

5.5.1　單行文本輸入框 69

5.5.2　多行文本輸入框 70

5.5.3　密碼域 70

5.5.4　單選按鈕 71

5.5.5　復選框 72

5.5.6　下拉選擇框 73

5.5.7　普通按鈕 73

5.5.8　提交按鈕 74

5.5.9　重置按鈕 75

5.6　表單高級元素的使用 75

5.6.1　url屬性的應用 76

5.6.2　email屬性的應用 76

5.6.3　date和time屬性的應用 76

5.6.4　number屬性的應用 77

5.6.5　range屬性的應用 78

5.6.6　required屬性的應用 79

5.7　創(chuàng)建用戶反饋表單 79

5.8　制作商品報價單 81

5.9　大神解惑 83

5.10　跟我練練手 84

第2篇　HTML5高級技術(shù)

第6章　HTML5快速入門

6.1　各大瀏覽器與HTML5的兼容性 88

6.2　檢測瀏覽器是否支持HTML標記 88

6.3　語法變化和標記 89

6.3.1　HTML5的語法變化 89

6.3.2　HTML5中的標記方法 89

6.3.3　版本兼容性 90

6.4　新增的元素和廢除的元素 91

6.4.1　新增的結(jié)構(gòu)元素 92

6.4.2　新增的input元素類型 94

6.4.3　新增的其他元素 94

6.4.4　廢除的元素 96

6.5　新增的屬性和廢除的屬性 97

6.5.1　新增的屬性 97

6.5.2　廢除的屬性 101

6.6　新增全局屬性 103

6.6.1　contentEditable屬性 103

6.6.2　designMode屬性 103

6.6.3　hidden屬性 104

6.6.4　spellcheck屬性 104

6.6.5　tabIndex屬性 104

6.7　大神解惑 106

6.8　跟我練練手 106

第7章　HTML5中的多媒體

7.1　網(wǎng)頁音頻標記 108

7.1.1　audio標記概述 108

7.1.2　audio標記的屬性 108

7.1.3　音頻解碼器 109

7.1.4　瀏覽器對audio標記的支持情況 109

7.2　網(wǎng)頁視頻標記 109

7.2.1　video標記概述 109

7.2.2　video標記屬性 110

7.2.3　視頻解碼器 110

7.2.4　瀏覽器對video標記的支持情況 111

7.3　添加網(wǎng)頁音頻文件 111

7.3.1　設(shè)置背景音樂 111

7.3.2　設(shè)置音樂循環(huán)播放 112

7.4　添加網(wǎng)頁視頻文件 112

7.4.1　為網(wǎng)頁添加視頻文件 112

7.4.2　設(shè)置自動運行 113

7.4.3　設(shè)置視頻文件的循環(huán)播放 114

7.4.4　設(shè)置視頻窗口的高度與寬度 114

7.5　添加網(wǎng)頁滾動文字 115

7.5.1　滾動文字標記 115

7.5.2　滾動方向?qū)傩?span id="epizqqp1gsyu" class="Apple-tab-span" style="white-space:pre"> 116

7.5.3　滾動方式屬性 117

7.5.4　滾動速度屬性 117

7.5.5　滾動延遲屬性 118

7.5.6　滾動循環(huán)屬性 119

7.5.7　滾動范圍屬性 119

7.5.8　滾動背景顏色屬性 120

7.5.9　滾動空間屬性 121

7.6　大神解惑 122

7.7　跟我練練手 122

第8章　使用HTML5繪制圖形

8.1　什么是canvas 124

8.2　繪制基本形狀 125

8.2.1　繪制矩形 125

8.2.2　繪制圓形 126

8.2.3　使用moveTo與lineTo繪制直線 127

8.2.4　使用bezierCurveTo繪制貝塞爾曲線 128

8.3　繪制漸變圖形 130

8.3.1　繪制線性漸變 130

8.3.2　繪制徑向漸變 132

8.4　繪制變形圖形 133

8.4.1　變換原點坐標 133

8.4.2　圖形縮放 134

8.4.3　旋轉(zhuǎn)圖形 135

8.5　繪制其他樣式的圖形 136

8.5.1　圖形組合 136

8.5.2　繪制帶陰影的圖形 138

8.5.3　繪制文字 139

8.6　使用圖像 141

8.6.1　繪制圖像 141

8.6.2　圖像平鋪 142

8.6.3　圖像裁剪 143

8.6.4　像素處理 145

8.7　圖形的保存與恢復 147

8.7.1　保存與恢復圖形狀態(tài) 147

8.7.2　保存文件 148

8.8　繪制火柴棒人物 149

8.9　繪制商標 151

8.10　大神解惑 153

8.11　跟我練練手 154

第3篇　用CSS美化網(wǎng)頁

第9章　CSS概述與基本語法

9.1　CSS概述 158

9.1.1　CSS功能 158

9.1.2　瀏覽器與CSS的兼容性 158

9.1.3　CSS基礎(chǔ)語法 159

9.1.4　CSS常用單位 159

9.2　編輯和瀏覽CSS 164

9.2.1　手工編寫CSS 164

9.2.2　用Dreamweaver編寫CSS 165

9.3　在HTML中使用CSS的方法 167

9.3.1　行內(nèi)樣式 167

9.3.2　內(nèi)嵌樣式 168

9.3.3　鏈接樣式 169

9.3.4　導入樣式 170

9.3.5　優(yōu)先級問題 171

9.4　CSS的常用選擇器 172

9.4.1　標記選擇器 173

9.4.2　類選擇器 173

9.4.3　ID選擇器 174

9.4.4　全局選擇器 175

9.4.5　組合選擇器 175

9.4.6　繼承選擇器 176

9.4.7　偽類選擇器 177

9.5　選擇器聲明 178

9.5.1　集體聲明 178

9.5.2　多重嵌套聲明 179

9.6　制作炫彩網(wǎng)站Logo 179

9.7　制作學生信息統(tǒng)計表 182

9.8　大神解惑 183

9.9　跟我練練手 184

第10章　美化網(wǎng)頁字體與段落

10.1　美化網(wǎng)頁文字 186

10.1.1　設(shè)置文字的字體 186

10.1.2　設(shè)置文字的字號 187

10.1.3　設(shè)置字體風格 188

10.1.4　設(shè)置加粗字體 189

10.1.5　將小寫字母轉(zhuǎn)換為大寫字母 190

10.1.6　設(shè)置字體的復合屬性 191

10.1.7　設(shè)置字體顏色 192

10.2　設(shè)置文本的高級樣式 193

10.2.1　設(shè)置文本陰影效果 193

10.2.2　設(shè)置文本溢出效果 194

10.2.3　設(shè)置文本的控制換行 195

10.2.4　保持字體尺寸不變 196

10.3　美化網(wǎng)頁中的段落 197

10.3.1　設(shè)置單詞之間的間隔 197

10.3.2　設(shè)置字符之間的間隔 198

10.3.3　設(shè)置文字的修飾效果 199

10.3.4　設(shè)置垂直對齊方式 200

10.3.5　轉(zhuǎn)換文本的大小寫 202

10.3.6　設(shè)置文本的水平對齊方式 203

10.3.7　設(shè)置文本的縮進效果 205

10.3.8　設(shè)置文本的行高 205

10.3.9　文本的空白處理 206

10.3.10　文本的反排 208

10.4　設(shè)置網(wǎng)頁標題 209

10.5　制作新聞頁面 211

10.6　大神解惑 212

10.7　跟我練練手 212

第11章　美化網(wǎng)頁圖片

11.1　圖片縮放 214

11.1.1　通過描述標記width和height縮放圖片 214

11.1.2　使用CSS中的max-width和

max-height縮放圖片 214

11.1.3　使用CSS中的width和height縮放圖片 215

11.2　設(shè)置圖片的對齊方式 216

11.2.1　設(shè)置圖片橫向?qū)�齊 216

11.2.2　設(shè)置圖片縱向?qū)�齊 217

11.3　圖文混排 219

11.3.1　設(shè)置文字環(huán)繞效果 219

11.3.2　設(shè)置圖片與文字的間距 220

11.4　制作學校宣傳單 221

11.5　制作簡單圖文混排網(wǎng)頁 223

 11.6　大神解惑 225

11.7　跟我練練手 225

第12章　美化網(wǎng)頁背景與邊框

12.1　使用CSS美化背景 228

12.1.1　設(shè)置背景顏色 228

12.1.2　設(shè)置背景圖片 229

12.1.3　背景圖片重復 230

12.1.4　背景圖片隨文檔滾動 231

12.1.5　背景圖片位置 233

12.1.6　背景圖片大小 234

12.1.7　背景顯示區(qū)域 235

12.1.8　背景圖像裁剪區(qū)域 237

12.1.9　背景復合屬性 237

12.2　使用CSS美化邊框 238

12.2.1　設(shè)置邊框樣式 238

12.2.2　設(shè)置邊框顏色 239

12.2.3　設(shè)置邊框線寬 240

12.2.4　設(shè)置邊框復合屬性 242

12.3　設(shè)置邊框圓角效果 242

12.3.1　設(shè)置圓角邊框 243

12.3.2　指定兩個圓角半徑 243

12.3.3　繪制四個不同的圓角邊框 244

12.3.4　繪制不同種類的邊框 245

12.4　制作簡單公司主頁 246

12.5　制作簡單生活資訊主頁 250

12.6　大神解惑 251

12.7　跟我練練手 252

第13章　美化表格和表單樣式

13.1　美化表格樣式 254

13.1.1　設(shè)置表格邊框樣式 254

13.1.2　設(shè)置表格邊框?qū)挾?span id="epizqqp1gsyu" class="Apple-tab-span" style="white-space:pre"> 255

13.1.3　設(shè)置表格背景顏色 256

13.2　美化表單樣式 257

13.2.1　美化表單中的元素 257

13.2.2　美化提交按鈕 259

13.2.3　美化下拉列表框 260

13.3　制作用戶登錄頁面 262

13.4　制作用戶注冊頁面 264

13.5　大神解惑 266

13.6　跟我練練手 266

第14章　美化超鏈接和鼠標指針

14.1　美化超鏈接 268

14.1.1　改變超鏈接基本樣式 268

14.1.2　設(shè)置帶有提示信息的超鏈接 269

14.1.3　設(shè)置超鏈接的背景圖 270

14.1.4　設(shè)置超鏈接的按鈕效果 271

14.2　美化鼠標特效 272

14.2.1　控制鼠標箭頭 272

14.2.2　設(shè)置鼠標變幻式超鏈接 273

14.2.3　設(shè)置網(wǎng)頁頁面滾動條 274

14.3　圖片版本超鏈接 276

14.4　鼠標特效實例 278

14.5　制作一個簡單的導航欄 280

14.6　大神解惑 281

14.7　跟我練練手 282

第15章　控制網(wǎng)頁導航菜單的樣式

15.1　使用CSS美化項目列表 284

15.1.1　美化無序列表 284

15.1.2　美化有序列表 285

15.1.3　美化自定義列表 286

15.1.4　制作圖片列表 287

15.1.5　縮進圖片列表 288

15.1.6　列表復合屬性 289

15.2　使用CSS制作網(wǎng)頁菜單 290

15.2.1　制作無序列表的菜單 290

15.2.2　制作水平樣式菜單 292

15.3　模擬SOSO導航欄 294

15.4　將段落轉(zhuǎn)變成列表 297

15.5　大神解惑 299

15.6　跟我練練手 300

第4篇　網(wǎng)頁布局和JavaScript

第16章　CSS+DIV盒子的浮動與定位

16.1　定義DIV 304

16.1.1　什么是DIV 304

16.1.2　創(chuàng)建DIV 304

16.2　盒子的定位 305

16.2.1　靜態(tài)定位 305

16.2.2　相對定位 306

16.2.3　絕對定位 307

16.2.4　固定定位 308

16.2.5　盒子的浮動 308

16.3　其他CSS布局定位方式 310

16.3.1　溢出（overflow）定位 310

16.3.2　隱藏（visibility）定位 311

16.3.3　z-index空間定位 313

16.4　多列布局 314

16.4.1　設(shè)置列寬度 314

16.4.2　設(shè)置列數(shù) 316

16.4.3　設(shè)置列間距 317

16.4.4　設(shè)置列邊框樣式 318

16.5　定位網(wǎng)頁布局樣式 320

16.6　大神解惑 323

16.7　跟我練練手 324

第17章　網(wǎng)頁布局剖析與制作

17.1　固定寬度網(wǎng)頁剖析與布局 326

17.1.1　網(wǎng)頁單列布局模式 326

17.1.2　網(wǎng)頁1-2-1型布局模式 328

17.1.3　網(wǎng)頁1-3-1型布局模式 330

17.2　自動縮放網(wǎng)頁1-2-1型布局模式 333

17.2.1　1-2-1等比例變寬布局 333

17.2.2　1-2-1單列變寬布局 334

17.3　自動縮放網(wǎng)頁1-3-1型布局模式 335

17.3.1　1-3-1三列寬度等比例布局 335

17.3.2　1-3-1單側(cè)列寬度固定的變寬布局 335

17.3.3　1-3-1中間列寬度固定的變寬布局 337

17.3.4　1-3-1雙側(cè)列寬度固定的變寬布局 339

17.3.5　1-3-1中列和左側(cè)列寬度固定的

變寬布局 342

17.4　分列布局背景色的使用 344

17.4.1　設(shè)置固定寬度布局的列背景色 344

17.4.2　設(shè)置特殊寬度變化布局的列背景色 346

17.4.3　設(shè)置單列寬度變化布局的列背景色 347

17.4.4　設(shè)置多列等比例寬度變化布局的

列背景 349

17.5　大神解惑 352

17.6　跟我練練手 352

第18章　JavaScript和jQuery

18.1　認識JavaScript 354

18.1.1　什么是JavaScript 354

18.1.2　在HTML網(wǎng)頁頭中嵌入

JavaScript代碼 354

18.2　JavaScript對象與函數(shù) 355

18.2.1　認識對象 356

18.2.2　認識函數(shù) 356

18.3　JavaScript事件 358

18.3.1　事件與事件處理概述 358

18.3.2　JavaScript的常用事件 359

18.4　認識jQuery 360

18.4.1　jQuery能做什么 361

18.4.2　jQuery的配置 361

18.5　jQuery選擇器 362

18.5.1　jQuery的工廠函數(shù) 362

18.5.2　常見選擇器 363

18.6　大神解惑 364

18.7　跟我練練手 365

第19章　經(jīng)典的網(wǎng)頁動態(tài)特效案例

19.1　文字特效 368

19.1.1　打字效果的文字 368

19.1.2　文字升降特效 370

19.1.3　跑馬燈效果 372

19.2　圖片特效 373

19.2.1　閃爍圖片 373

19.2.2　左右移動的圖片 375

19.3　網(wǎng)頁菜單特效 378

19.3.1　向上滾動菜單 378

19.3.2　樹形菜單 379

19.4　鼠標特效 384

19.4.1　鼠標的圖片跟蹤 384

19.4.2　鼠標的文字跟蹤 385

19.5　時間特效 387

19.5.1　時鐘特效 387

19.5.2　制作簡單日歷表 392

19.6　頁面特效 395

19.6.1　網(wǎng)頁自動滾屏 395

19.6.2　顏色選擇器 398

19.7　大神解惑 401

19.8　跟我練練手 402

第5篇　綜合案例實戰(zhàn)

第20章　制作企業(yè)門戶類網(wǎng)頁

20.1　構(gòu)思布局 406

20.1.1　設(shè)計分析 406

20.1.2　排版架構(gòu) 407

20.2　模塊分割 408

20.2.1　Logo與導航菜單 408

20.2.2　左側(cè)文本介紹 410

20.2.3　右側(cè)導航鏈接 411

20.2.4　版權(quán)信息 413

20.3　整體調(diào)整 414

第21章　制作在線購物類網(wǎng)頁

21.1　整體布局 416

21.1.1　設(shè)計分析 416

21.1.2　排版架構(gòu) 417

21.2　模塊分割 417

21.2.1　Logo與導航區(qū) 417

21.2.2　Banner與資訊區(qū) 419

21.2.3　產(chǎn)品類別區(qū)域 420

21.2.4　頁腳區(qū)域 421

第22章　制作移動設(shè)備類網(wǎng)頁

22.1　網(wǎng)站設(shè)計分析 424

22.2　網(wǎng)站結(jié)構(gòu)分析 424

22.3　網(wǎng)站主頁面的制作 425

22.4　網(wǎng)站成品預覽 427