主要內容
本書全面介紹了基於HTML5+CSS3的Web前端開發技術，在敘述有關原理時安排了大量的相關實例。本書分為9章，內容包括Web前端開發概述，HTML，HTML5與Web標準，CSS樣式美化，CSS布局，表格與表單，回響式網頁設計，JavaScript與jQuery基礎，Bootstrap回響式網頁設計等。附錄中安排了作為課程教學的實驗。
目 錄
第1章Web前端開發概述/1
1.1Web前端開發與網頁設計/1
1.1.1網頁的概念和本質/1
1.1.2網頁設計的兩個基本問題/2
1.1.3網頁設計語言——HTML簡介/3
1.1.4網頁製作軟體/4
1.2網站的創建和製作流程/5
1.2.1網站的特徵/5
1.2.2網站的開發步驟/6
1.2.3在Dreamweaver中建立站點/8
1.3Web伺服器與瀏覽器/10
1.3.1Web伺服器的作用/11
1.3.2瀏覽器的種類和作用/11
1.4URL與域名/13
習題1/14
第2章HTML/15
2.1HTML概述/15
2.1.1HTML文檔的結構/15
2.1.2Dreamweaver的開發界面/16
2.1.3使用DW新建HTML檔案/17
2.1.4HTML標記/17
2.1.5常見的HTML標記及屬性/18
2.2在網頁中添加文本和圖像/19
2.2.1創建文本和列表/19
2.2.2插入圖像/21
2.3利用DW代碼視圖提高效率/22
2.3.1代碼提示/23
2.3.2代碼快速定位/23
2.3.3DW中的常用快捷鍵/24
2.4創建超連結/25
2.4.1超連結標記<a>/25
2.4.2絕對URL與相對URL/27
2.4.3超連結的種類/28
2.4.4超連結目標的打開方式/30
2.4.5超連結製作的原則/30
2.4.6DW中超連結屬性面板的使用/31
2.5插入Flash及嵌入其他網頁/32
2.5.1插入Flash/32
2.5.2嵌入式框架標記<iframe>/33
2.6頭部標記/34
習題/35
第3章HTML5與Web標準/36
3.1HTML5的改進/36
3.1.1HTML5新增的標記/36
3.1.2HTML5語法的改進/38
3.1.3HTML5的視音頻功能/39
3.1.4HTML5的繪圖功能/41
3.2Web標準/44
3.2.1傳統HTML的缺點/44
3.2.2Web標準的含義/45
3.2.3Web標準的優勢/47
3.3HTML元素的概念/47
3.3.1行內元素和塊級元素/48
3.3.2<div>和<span>標記/48
習題/49
第4章CSS樣式美化/50
4.1CSS基礎/50
4.1.1CSS的語法/50
4.1.2在HTML中引入CSS的方法/51
4.1.3選擇器的分類/53
4.1.4CSS文本修飾/56
4.2CSS的特性/57
4.2.1CSS的層疊性/57
4.2.2CSS的繼承性/59
4.2.3選擇器的組合/60
4.3CSS高級選擇器/64
4.3.1關係選擇器/64
4.3.2屬性選擇器/66
4.3.3偽類選擇器/67
4.3.4使用過渡屬性配合動態偽類效果/70
4.3.5偽元素選擇器/73
4.4CSS設計和書寫技巧/75
4.4.1CSS樣式總體設計原則/75
4.4.2DW對CSS的可視化編輯支持/76
4.4.3CSS屬性的值和單位/79
4.4.4網頁中的字型/80
4.4.5字型圖示技術/82
4.5盒子模型及其屬性/84
4.5.1盒子模型概述/84
4.5.2框線border屬性/85
4.5.3圓角borderradius屬性/87
4.5.4圖像框線borderimage屬性/89
4.5.5padding和margin屬性/91
4.6標準流下的定位及套用/92
4.6.1標準流下的定位原則/92
4.6.2margin合併現象/95
4.6.3盒子模型的套用/96
4.6.4Chrome瀏覽器的CSS調試功能/99
4.7背景的運用/100
4.7.1CSS的背景屬性/100
4.7.2背景的基本運用技術/104
4.7.3滑動門技術/107
4.7.4背景圖像的翻轉/111
4.7.5傳統圓角效果/112
4.8CSS3樣式美化功能/114
4.8.1陰影和發光效果/114
4.8.2漸變效果/117
4.8.3描邊效果/120
4.8.4遮罩效果/121
4.9變形與動畫效果/123
4.9.1平面變形效果/123
4.9.23D變換效果/126
4.9.3animation動畫效果/131
習題/134
第5章CSS布局/137
5.1浮動/137
5.1.1盒子浮動後的特點/137
5.1.2清除浮動元素的影響/140
5.1.3清除浮動影響的方法/140
5.2浮動的套用舉例/143
5.2.1圖文混排及首字下沉效果/143
5.2.2水平導航條/144
5.2.3新聞欄目框/145
5.2.4微博對話框/148
5.3相對定位/149
5.3.1定位屬性和偏移屬性/149
5.3.2相對定位的特點/149
5.3.3相對定位的套用舉例/150
5.4絕對定位和固定定位/152
5.4.1絕對定位/152
5.4.2絕對定位的套用舉例/154
5.4.3固定定位/163
5.4.4與定位屬性有關的CSS屬性/163
5.4.5overflow屬性/166
5.4.6vertical-align屬性/167
5.5CSS分欄布局/168
5.5.1分欄布局的種類/169
5.5.2網頁居中的方法/170
5.5.31-3-1版式網頁布局/170
5.5.41-2-1可變寬度布局/174
5.5.5CSS兩列布局案例/176
5.5.6HTML5新增的文檔結構標記/181
5.5.7HTML5網頁布局案例/183
5.6CSS3新增的布局方式/186
5.6.1彈性盒布局/186
5.6.2分欄布局/190
5.7CSS瀏覽器的兼容問題/192
習題/193
第6章表格與表單/195
6.1創建表格/195
6.1.1表格標記/195
6.1.2表格行和單元格標記/197
6.1.3在DW中操作表格的方法/199
6.1.4製作固定寬度的表格/201
6.1.5特殊效果表格的製作/201
6.2使用CSS美化表格/203
6.2.1框線和背景的美化/203
6.2.2隔行變色效果/204
6.3創建表單/205
6.3.1<form>標記及其屬性/206
6.3.2<input>標記/208
6.3.3<select>和<option>標記/211
6.3.4多行文本域標記<textarea>/211
6.3.5表單數據的傳遞過程/212
6.3.6表單中的按鈕/213
6.3.7表單的輔助標記/214
6.3.8HTML5新增的表單標記和屬性/215
6.4美化表單/218
6.4.1搜尋框/218
6.4.2用戶登錄表單/219
6.4.3用戶註冊表單/222
習題/223
第7章回響式網頁設計/225
7.1回響式網頁的基本技術/225
7.1.1媒體查詢/225
7.1.2流式布局/227
7.1.3自適應圖片/229
7.1.4一列變寬、一列固定的方法/231
7.1.5回響式網頁的頭部代碼設定/231
7.2回響式布局的網站實例/232
7.2.1頁面總體布局的實現/233
7.2.2頁頭的設計/235
7.2.3回響式導航條的製作/235
7.2.4回響式欄目的製作/237
習題/239
第8章JavaScript與jQuery基礎/240
8.1JavaScript的代碼結構/240
8.2JavaScript的事件編程/242
8.2.1JavaScript語言基礎/242
8.2.2常用JavaScript事件/242
8.2.3事件監聽程式/243
8.3JavaScriptDOM編程/245
8.3.1動態效果的實現/245
8.3.2獲取指定元素/246
8.3.3訪問元素的CSS屬性/247
8.3.4訪問元素的內容/249
8.4使用瀏覽器對象/249
8.5jQuery基礎/253
8.5.1jQuery的功能和使用/253
8.5.2jQuery中的“$”/254
8.5.3jQuery對象與DOM對象/258
8.5.4jQuery的選擇器/260
8.5.5jQuery的事件綁定/261
8.5.6jQuery中的常用方法/262
8.5.7jQuery套用舉例/263
習題/265
第9章Bootstrap回響式網頁設計/267
9.1Bootstrap的使用/267
9.1.1下載和引用Bootstrap框架/267
9.1.2Bootstrap柵格系統/269
9.1.3使用柵格系統進行回響式布局/271
9.2Bootstrap中的網頁組件/277
9.2.1基於組件的網頁製作方法/277
9.2.2導航條/279
9.2.3輪播外掛程式/283
9.2.4選項卡面板/286
9.2.5媒體對象/288
9.2.6摺疊面板組/290
9.2.7提示框與彈出框/292
9.2.8模態彈窗/293
9.3Bootstrap網頁重構實例/295
習題/297
附錄實驗/299
實驗1個人簡歷網頁/299
實驗2圓餅型盒子的製作/299
實驗3製作背景翻轉的圖示/300
實驗4欄目框的製作/300
實驗5頁頭和導航條的製作/301
實驗6圖片滾動欄的製作/301
實驗7網頁的布局設計/301
實驗8網站首頁的實現/301
實驗9網站列表頁的實現/301
實驗10製作下拉選單/302
實驗11製作Tab面板/302
實驗12使用Bootstrap製作回響式網頁/302
參考文獻/303
