|
|
|
本書是一本從零開始學習的Web前端開發教材，無須額外的基礎。全書以項目驅動為宗旨，詳細介紹了HTML5、CSS3與JavaScript的基礎知識與使用技巧。
全書共包含11章，可分為以下3個部分：
第一部分是基礎知識篇，包括第1章至第4章的內容。
第二部分是重點篇，包括第5章至第10章的內容。
第三部分是提高篇，包括第11章的內容。
本書包含全部例題228個，均在瀏覽器中調試通過。由於很多HTML5和CSS3的代碼需要較高版本瀏覽器方能提供更好的體驗效果，建議讀者使用但不限於Internet Explorer 10.0、Chrome 17.0、Firefox 10.0、Safari 5.0或Opera 11.1以上版本的瀏覽器。本書不僅可以作為高校計算機相關專業HTML5的課程教材，也可作為學習HTML5開發的自學教材或培訓教材。
第一部分 基礎知識篇
第1章 緒論3
1.1Web原理基礎3
1.1.1Internet與萬維網3
1.1.2Web架構4
1.1.3Web應用4
1.2Web前端技術基礎5
1.2.1HTML技術5
1.2.2CSS技術6
1.2.3JavaScript技術6
1.3Web前端新技術7
1.3.1HTML5技術7
1.3.2CSS3技術8
1.4Web開發工具9
1.4.1Adobe Dreamweaver9
1.4.2Sublime Text10
1.4.3NodePad++11
1.4.4EditPlus11
1.5Web技術的前景與展望12
1.5.1Flash的興衰12
1.5.2HTML5的前景12
1.5.3未來展望12
1.6本章小結13
習題113
第2章 HTML5基礎14
2.1HTML5基本結構14
2.1.1文檔類型聲明＜！DOCTYPE＞15
2.1.2根標簽＜html＞15
2.1.3首部標簽＜head＞16
2.1.4主體標簽＜body＞18
2.1.5HTML5文檔注釋18
2.1.6HTML5文檔規范19
2.1.7HTML4.01轉換為HTML521
2.2HTML5保留的常用標簽22
2.2.1基礎標簽22
2.2.2文本格式標簽25
2.2.3列表標簽28
2.2.4圖像標簽33
2.2.5超鏈接標簽34
2.2.6表格標簽37
2.2.7框架標簽38
2.2.8容器標簽38
2.3HTML5新增的常用標簽40
2.3.1HTML5新增文檔結構標簽40
2.3.2HTML5新增格式標簽45
2.4HTML5新增API47
2.5本章小結48
習題248
第3章 CSS基礎49
3.1CSS樣式表49
3.1.1內聯樣式表49
3.1.2內部樣式表50
3.1.3外部樣式表52
3.1.4樣式表層疊優先級53
3.2CSS選擇器54
3.2.1元素選擇器54
3.2.2ID選擇器54
3.2.3類選擇器55
3.2.4屬性選擇器57
3.3語法規則58
3.3.1注釋語句58
3.3.2@charset59
3.3.3！important59
3.4CSS取值與單位59
3.4.1數字59
3.4.2長度60
3.4.3角度60
3.4.4時間60
3.4.5文本61
3.4.6顏色61
3.5CSS常用樣式64
3.5.1CSS背景64
3.5.2CSS框模型73
3.5.3CSS文本84
3.5.4CSS字體89
3.5.5CSS超鏈接95
3.5.6CSS列表96
3.5.7CSS表格105
3.6CSS定位113
3.6.1絕對定位113
3.6.2相對定位115
3.6.3層疊效果116
3.6.4浮動118
3.7本章小結121
習題3121
第4章 JavaScript基礎122
4.1JavaScript的實現122
4.1.1ECMAScript122
4.1.2DOM122
4.1.3BOM122
4.2JavaScript的使用122
4.2.1內部JavaScript123
4.2.2外部JavaScript124
4.3JavaScript的語法125
4.3.1JavaScript的大小寫125
4.3.2JavaScript分號125
4.3.3JavaScript注釋125
4.3.4JavaScript代碼塊126
4.4JavaScript變量126
4.4.1變量的聲明126
4.4.2變量的命名規范127
4.4.3JavaScript關鍵字和保留字128
4.5JavaScript基本數據類型128
4.5.1Undefined類型129
4.5.2Null類型130
4.5.3String類型130
4.5.4Number類型140
4.5.5Boolean類型146
4.6JavaScript對象類型147
4.6.1本地對象147
4.6.2內置對象155
4.6.3宿主對象158
4.7JavaScript類型轉換158
4.7.1轉換成字符串158
4.7.2轉換成數字159
4.7.3強制類型轉換162
4.8JavaScript運算符164
4.8.1賦值運算符164
4.8.2算術運算符164
4.8.3邏輯運算符165
4.8.4關系運算符169
4.8.5相等性運算符171
4.8.6條件運算符172
4.9JavaScript條件語句172
4.9.1if語句172
4.9.2switch語句174
4.10JavaScript循環語句176
4.10.1for循環176
4.10.2for—in循環177
4.10.3while循環178
4.10.4do—while循環179
4.10.5break和continue180
4.11JavaScript函數182
4.11.1函數的基本結構182
4.11.2函數的調用182
4.11.3函數的返回值183
4.12文檔對象模型DOM185
4.12.1查找HTML元素185
4.12.2DOM HTML187
4.12.3DOM CSS190
4.12.4DOM事件191
4.12.5DOM節點192
4.13瀏覽器對象模型BOM195
4.13.1Window對象196
4.13.2Screen對象197
4.13.3Location對象197
4.13.4History對象198
4.13.5Navigator對象199
4.14本章小結200
習題4201
第二部分 重點篇
第5章 HTML5拖放API205
5.1HTML5新增拖放API205
5.2瀏覽器支持情況205
5.3HTML5拖放API的應用205
5.3.1DragEvent事件205
5.3.2DataTransfer對象206
5.3.3拖放元素過程207
5.3.4自定義拖放圖標211
5.3.5自定義拖放行為213
5.3.6本地文件的拖放215
5.4本章小結217
習題5218
第6章 HTML5表單API219
6.1HTML表單基礎219
6.1.1表單標簽＜form＞219
6.1.2輸入標簽＜input＞220
6.1.3標記標簽＜label＞233
6.1.4多行文本標簽＜textarea＞235
6.1.5列表標簽＜select＞236
6.1.6按鈕標簽＜button＞241
6.1.7域標簽＜fieldset＞和域標題標簽＜legend＞243
6.2HTML5表單新特性245
6.2.1HTML5表單新增輸入類型245
6.2.2HTML5表單新增元素標簽259
6.2.3HTML5表單新增屬性263
6.3本章小結278
習題6278
第7章 HTML5畫布API279
7.1畫布概述279
7.1.1HTML5畫布279
7.1.2畫布坐標279
7.1.3主流瀏覽器支持情況一覽280
7.2HTML5畫布API的應用280
7.2.1檢查瀏覽器支持情況280
7.2.2創建畫布281
7.2.3畫布繪制方法282
7.2.4繪制路徑282
7.2.5繪制矩形289
7.2.6繪制圖片292
7.2.7繪制文本295
7.2.8顏色與樣式296
7.2.9保存和恢復306
7.2.10變形308
7.2.11剪裁313
7.3本章小結315
習題7315
第8章 HTML5媒體API316
8.1HTML5媒體API概述316
8.1.1HTML5音頻和視頻316
8.1.2HTML5媒體支持的格式316
8.2主流瀏覽器支持情況一覽317
8.2.1對HTML5音頻的支持情況317
8.2.2對HTML5視頻的支持情況317
8.3HTML5音頻的應用318
8.3.1HTML5音頻的基本格式318
8.3.2檢查瀏覽器支持情況319
8.3.3音頻來源多樣性321
8.3.4自定義音頻控制322
8.4HTML5視頻的應用324
8.4.1HTML5視頻的基本格式324
8.4.2檢查瀏覽器支持情況325
8.4.3視頻來源多樣性327
8.4.4自定義視頻控制328
8.5HTML5媒體API其他通用功能332
8.5.1標記媒體播放時間范圍332
8.5.2跳轉媒體播放時間點333
8.5.3獲取媒體播放時間335
8.5.4終止媒體文件的下載337
8.5.5使用Flash播放器339
8.6本章小結340
習題8341
第9章 HTML5地理定位API342
9.1位置信息342
9.1.1經緯度坐標342
9.1.2位置信息的來源342
9.2主流瀏覽器支持情況一覽343
9.3HTML5地理位置API的應用343
9.3.1檢查瀏覽器支持情況343
9.3.2Geolocation接口345
9.3.3獲取當前定位345
9.3.4實時更新定位353
9.4本章小結356
習題9357
第10章 HTML5Web存儲API358
10.1Web存儲技術概述358
10.1.1HTTP Cookie存儲358
10.1.2HTML5 Web存儲358
10.2主流瀏覽器支持情況359
10.3HTML5 Web存儲API的應用359
10.3.1檢查瀏覽器支持情況359
10.3.2Storage接口360
10.3.3localStorage vs sessionStorage361
10.3.4存儲數據361
10.3.5讀取指定數據365
10.3.6數據遍歷367
10.3.7刪除指定數據369
10.3.8清空所有數據371
10.4本章小結374
習題10375
第三部分 提高篇
第11章 CSS3技術379
11.1CSS3邊框和背景效果379
11.1.1CSS3邊框379
11.1.2CSS3背景效果386
11.2CSS3文本和字體效果391
11.2.1CSS3文本391
11.2.2CSS3字體397
11.3CSS3變形與動畫效果399
11.3.1CSS32D變形399
11.3.2CSS3 Transition動畫411
11.3.3CSS3 Animation動畫416
11.4CSS3多列423
11.4.1columns423
11.4.2column—gap423
11.4.3column—rule424
11.5本章小結427
習題11427
附錄428
附錄A HTML5元素標簽對照表428
附錄B HTML5事件屬性對照表431
附錄C CSS3顏色名稱對照表433
