HTML5 + CSS3 從入門到精通, 2/e (微課精編版)
前端科技
買這商品的人也買了...
-
$356UI 設計黃金法則 : 觸動人心的 100種用戶界面
-
$450$356 -
$403從零開始學UI 概念解析 實戰提高 突破規則
-
$768$730 -
$450$356 -
$419$398 -
$305移動端 APP UI 設計與交互基礎教程, 2/e (微課版)
相關主題
商品描述
《HTML5+CSS3從入門到精通(微課精編版)(第2版)》從初學者角度出發,通過通俗易懂的語言、大量的實例,系統講解了HTML5和CSS3的基礎理論和實際應用技術,並進行了深入淺出的分析。本書分為上下兩冊,共29章。上冊為HTML5篇,內容包括HTML5基礎、HTML5文檔、 HTML5文本、HTML5多媒體、HTML5表單、HTML5繪圖、HTML5 SVG矢量圖、HTML5請求動畫和異步處理、HTML5文件操作、HTML5通信、HTML5存儲、HTML5異步請求、HTML5線程、HTML5緩存、HTML5 Web組件、HTML5歷史記錄、HTML5訪問多媒體設備、HTML5訪問傳感器、HTML5訪問位置、HTML5拖放操作、HTML5通知和顯示;下冊為CSS3篇,內容包括CSS3基礎、CSS3文本、CSS3背景、CSS3用戶接口、CSS3佈局、CSS3動畫、CSS3媒體查詢和CSS3項目實戰,其中CSS3項目實戰為線上資源。書中所有知識都結合具體實例進行介紹,代碼註釋詳盡,讀者可輕松掌握前端技術精髓,提升實際開發能力。
目錄大綱
目錄
■上冊 · HTML5篇
第1章 HTML5基礎 / 1
1.1 HTML5概述 / 1
1.1.1 HTML歷史 / 1
1.1.2 HTML5起源 / 2
1.1.3 HTML5組織 / 3
1.1.4 HTML5規則 / 3
1.1.5 HTML5特性 / 3
1.1.6 瀏覽器支持 / 5
1.2 HTML5設計原則 / 5
1.2.1 避免不必要的復雜性 / 6
1.2.2 支持已有內容 / 6
1.2.3 解決實際問題 / 7
1.2.4 用戶怎麽使用就怎麽設計規範 / 7
1.2.5 優雅地降級 / 7
1.2.6 支持的優先級 / 8
1.3 HTML5語法特性 / 9
1.3.1 文檔和標記 / 9
1.3.2 寬松的約定 / 9
1.4 HTML5 API / 10
1.4.1 新增的API / 10
1.4.2 修改的API / 11
1.4.3 擴展Document / 12
1.4.4 擴展HTMLElement / 12
1.4.5 其他接口擴展 / 13
1.4.6 棄用的API / 14
1.5 案例實戰 / 14
1.5.1 新建HTML5文檔 / 14
1.5.2 比較HTML4和HTML5文檔 / 15
1.6 在線支持 / 16
第2章 HTML5文檔 / 17
2.1 HTML5標簽概述 / 17
2.1.1 新增的元素 / 17
2.1.2 廢除的元素 / 17
2.1.3 新增的屬性 / 18
2.1.4 廢除的屬性 / 18
2.1.5 新增的事件 / 18
2.1.6 事件監聽配置對象 / 19
2.2 HTML5全局屬性 / 20
2.2.1 內容可編輯 / 20
2.2.2 data—自定義屬性 / 21
2.2.3 draggable—拖動 / 22
2.2.4 hidden—隱藏 / 22
2.2.5 語法檢查 / 22
2.2.6 翻譯 / 23
2.3 HTML5新結構 / 23
2.3.1 定義頁眉 / 23
2.3.2 定義導航 / 24
2.3.3 定義主要區域 / 25
2.3.4 定義文章塊 / 26
2.3.5 定義區塊 / 27
2.3.6 定義附欄 / 28
2.3.7 定義頁腳 / 29
2.3.8 使用role / 30
2.4 案例實戰 / 31
2.5 在線支持 / 33
第3章 HTML5文本 / 34
3.1 通用文本 / 34
3.1.1 標題文本 / 34
3.1.2 段落文本 / 34
3.2 描述性文本 / 35
3.2.1 強調文本 / 35
3.2.2 標記細則 / 35
3.2.3 特殊格式 / 36
3.2.4 定義上標和下標 / 36
3.2.5 定義術語 / 38
3.2.6 標記代碼 / 39
3.2.7 預定義格式 / 39
3.2.8 定義縮寫詞 / 40
3.2.9 標註編輯或不用文本 / 40
3.2.10 指明引用或參考 / 42
3.2.11 引述文本 / 42
3.2.12 換行顯示 / 44
3.2.13 修飾文本 / 44
3.2.14 非文本註解 / 44
3.3 特殊用途文本 / 45
3.3.1 標記高亮顯示 / 45
3.3.2 標記進度信息 / 46
3.3.3 標記刻度信息 / 47
3.3.4 標記時間信息 / 48
3.3.5 標記聯系信息 / 49
3.3.6 標記顯示方向 / 49
3.3.7 標記換行斷點 / 50
3.3.8 標記旁註 / 50
3.3.9 標記展開/收縮詳細信息 / 51
3.3.10 標記對話框信息 / 51
3.4 其他類型文本 / 53
3.4.1 超鏈接 / 53
3.4.2 有序列表 / 53
3.4.3 描述列表 / 54
3.4.4 浮動框架 / 54
3.4.5 異步執行腳本 / 54
3.5 在線支持 / 55
第4章 HTML5多媒體 / 56
4.1 響應式圖像 / 56
4.1.1 定義流內容 / 56
4.1.2 使用picture元素 / 57
4.1.3 設計橫屏和豎屏顯示 / 58
4.1.4 根據分辨率顯示不同圖像 / 59
4.1.5 根據格式顯示不同圖像 / 59
4.1.6 自適應像素比 / 59
4.1.7 自適應視圖寬 / 60
4.2 使用插件 / 61
4.3 使用音頻和視頻 / 62
4.3.1 使用audio元素 / 62
4.3.2 使用video元素 / 63
4.3.3 視頻同步字幕 / 65
4.4 案例實戰 / 69
4.5 在線支持 / 72
第5章 HTML5表單 / 73
5.1 認識HTML5表單 / 73
5.2 HTML5新型輸入框 / 74
5.2.1 定義E-mail框 / 74
5.2.2 定義URL框 / 74
5.2.3 定義數字框 / 75
5.2.4 定義範圍框 / 76
5.2.5 定義日期選擇器 / 77
5.2.6 定義搜索框 / 80
5.2.7 定義電話號碼框 / 81
5.2.8 定義拾色器 / 81
5.3 HTML5輸入屬性 / 82
5.3.1 定義自動完成 / 82
5.3.2 定義自動獲取焦點 / 83
5.3.3 定義所屬表單 / 84
5.3.4 定義表單重寫 / 84
5.3.5 定義高和寬 / 85
5.3.6 定義列表選項 / 85
5.3.7 定義最小值、最大值和步長 / 85
5.3.8 定義多選 / 86
5.3.9 定義匹配模式 / 86
5.3.10 定義替換文本 / 87
5.3.11 定義必填 / 87
5.3.12 定義文本區域 / 88
5.3.13 定義復選框狀態 / 88
5.3.14 獲取文本選取方向 / 89
5.3.15 訪問標簽綁定的控件 / 89
5.3.16 訪問控件的標簽集 / 90
5.4 HTML5新表單元素 / 90
5.4.1 定義數據列表 / 90
5.4.2 定義密鑰對生成器 / 91
5.4.3 定義輸出結果 / 91
5.5 HTML5表單屬性 / 92
5.5.1 定義自動完成 / 92
5.5.2 定義禁止驗證 / 93
5.6 案例實戰 / 93
5.6.1 設計HTML5表單頁 / 93
5.6.2 設計表單驗證 / 95
5.7 在線支持 / 97
第6章 HTML5繪圖 / 98
6.1 使用canvas / 98
6.2 繪制圖形 / 100
6.2.1 矩形 / 100
6.2.2 路徑 / 100
6.2.3 直線 / 102
6.2.4 圓弧 / 102
6.2.5 二次方曲線 / 104
6.2.6 三次方曲線 / 105
6.3 定義樣式和顏色 / 106
6.3.1 顏色 / 106
6.3.2 不透明度 / 107
6.3.3 實線 / 108
6.3.4 虛線 / 110
6.3.5 線性漸變 / 110
6.3.6 徑向漸變 / 111
6.3.7 圖案 / 112
6.3.8 陰影 / 112
6.3.9 填充規則 / 113
6.4 圖形變形 / 113
6.4.1 保存和恢復狀態 / 113
6.4.2 清除畫布 / 114
6.4.3 移動坐標 / 115
6.4.4 旋轉坐標 / 116
6.4.5 縮放圖形 / 117
6.4.6 變換圖形 / 118
6.5 圖形合成 / 119
6.5.1 合成 / 119
6.5.2 裁切 / 121
6.6 繪制文本 / 121
6.6.1 填充文字 / 121
6.6.2 輪廓文字 / 122
6.6.3 文本樣式 / 123
6.6.4 測量寬度 / 124
6.7 使用圖像 / 125
6.7.1 導入圖像 / 125
6.7.2 縮放圖像 / 126
6.7.3 裁切圖像 / 127
6.7.4 平鋪圖像 / 127
6.8 像素操作 / 128
6.8.1 認識ImageData對象 / 128
6.8.2 創建圖像數據 / 129
6.8.3 將圖像數據寫入畫布 / 129
6.8.4 在畫布中復制圖像數據 / 130
6.8.5 保存圖片 / 131
6.9 案例實戰 / 131
6.10 在線支持 / 134
第7章 HTML5 SVG矢量圖 / 135
7.1 SVG基礎 / 135
7.1.1 SVG發展歷史 / 135
7.1.2 SVG特點 / 135
7.1.3 在HTML中應用SVG / 136
7.1.4 設計第一個SVG圖形 / 136
7.2 使用SVG / 137
7.2.1 矩形 / 137
7.2.2 圓形 / 139
7.2.3 橢圓 / 139
7.2.4 多邊形 / 140
7.2.5 直線 / 141
7.2.6 折線 / 141
7.2.7 路徑 / 142
7.2.8 文本 / 143
7.2.9 線框樣式 / 144
7.2.10 SVG濾鏡 / 146
7.2.11 模糊效果 / 147
7.2.12 陰影效果 / 147
7.2.13 線性漸變 / 147
7.2.14 放射漸變 / 148
7.3 案例實戰 / 149
7.4 在線支持 / 151
第8章 HTML5請求動畫和異步處理 / 152
8.1 請求動畫 / 152
8.1.1 requestAnimationFrame基礎 / 152
8.1.2 案例:設計進度條 / 153
8.2 異步處理 / 154
8.2.1 Promise基礎 / 154
8.2.2 創建Promise對象 / 159
8.2.3 使用then()方法 / 160
8.2.4 隊列化異步操作 / 162
8.2.5 異常處理 / 163
8.2.6 創建序列 / 164
8.2.7 並行處理 / 166
8.3 在線支持 / 168
第9章 HTML5文件操作 / 169
9.1 FileList / 169
9.2 Blob / 170
9.2.1 訪問Blob / 170
9.2.2 創建Blob / 171
9.2.3 截取Blob / 172
9.2.4 保存Blob / 173
9.3 FileReader / 174
9.3.1 讀取文件 / 174
9.3.2 事件監測 / 176
9.4 ArrayBuffer和ArrayBufferView / 177
9.4.1 使用ArrayBuffer / 178
9.4.2 使用ArrayBufferView / 178
9.4.3 使用DataView / 179
9.5 FileSystem API / 181
9.5.1 認識FileSystem API / 181
9.5.2 訪問FileSystem / 181
9.5.3 申請配額 / 183
9.5.4 新建文件 / 184
9.5.5 寫入數據 / 186
9.5.6 添加數據 / 187
9.5.7 讀取數據 / 188
9.5.8 復制文件 / 188
9.5.9 刪除文件 / 189
9.5.10 創建目錄 / 190
9.5.11 讀取目錄 / 191
9.5.12 刪除目錄 / 193
9.5.13 復制目錄 / 194
9.5.14 重命名目錄 / 195
9.5.15 使用filesystem:URL / 196
9.6 案例實戰 / 197
9.7 在線支持 / 199
第10章 HTML5通信 / 200
10.1 跨文檔發送消息 / 200
10.2 消息通道通信 / 203
10.3 網絡套接字通信 / 205
10.3.1 什麽是Socket / 205
10.3.2 為什麽需要Socket / 206
10.3.3 Socket的歷史 / 206
10.3.4 WebSocket基礎 / 207
10.3.5 使用WebSocket API / 207
10.3.6 案例:設計簡單的通信 / 209
10.3.7 案例:發送JSON信息 / 213
10.4 服務器推送事件通信 / 213
10.4.1 Server-Sent Events基礎 / 213
10.4.2 使用Server-Sent Events / 214
10.5 廣播通道通信 / 217
10.6 案例實戰 / 218
10.7 在線支持 / 221
第11章 HTML5存儲 / 222
11.1 Web Storage / 222
11.1.1 使用Web Storage / 222
11.1.2 案例:用戶登錄 / 223
11.2 indexedDB / 225
11.2.1 indexedDB概述 / 225
11.2.2 建立連接 / 225
11.2.3 數據庫版本 / 227
11.2.4 對象倉庫 / 227
11.2.5 索引 / 229
11.2.6 事務 / 231
11.2.7 游標 / 233
11.2.8 保存數據 / 234
11.2.9 訪問數據 / 235
11.2.10 更新版本 / 236
11.2.11 訪問鍵值 / 236
11.2.12 訪問屬性 / 238
11.2.13 案例:留言本 / 240
11.3 案例實戰 / 242
11.4 在線支持 / 251
第12章 HTML5異步請求 / 252
12.1 XMLHttpRequest 2基礎 / 252
12.1.1 XMLHttpRequest 2概述 / 252
12.1.2 請求時限 / 252
12.1.3 FormData數據對象 / 253
12.1.4 上傳文件 / 254
12.1.5 跨域訪問 / 255
12.1.6 響應不同類型數據 / 256
12.1.7 接收二進制數據 / 257
12.1.8 監測數據傳輸進度 / 260
12.2 Fetch基礎 / 263
12.2.1 Fetch概述 / 263
12.2.2 使用Fetch / 263
12.2.3 Fetch接口類型 / 265
12.3 案例實戰 / 266
12.3.1 接收Blob對象 / 266
12.3.2 發送Blob對象 / 267
12.4 在線支持 / 268
第13章 HTML5線程 / 269
13.1 Web Workers基礎 / 269
13.1.1 Web Workers概述 / 269
13.1.2 使用Worker / 270
13.1.3 使用共享線程 / 273
13.1.4 使用Inline Worker / 275
13.2 案例實戰 / 276
13.2.1 過濾運算 / 276
13.2.2 並發運算 / 277
13.3 在線支持 / 279
第14章 HTML5緩存 / 280
14.1 online/offline status API基礎 / 280
14.2 Cache API基礎 / 281
14.2.1 Cache API概述 / 281
14.2.2 使用Cache / 282
14.3 Service Worker基礎 / 285
14.3.1 Service Worker概述 / 285
14.3.2 使用Service Worker / 286
14.4 案例實戰 / 291
14.5 在線支持 / 293
第15章 HTML5 Web組件 / 294
15.1 HTML5模板 / 294
15.1.1 認識template / 294
15.1.2 使用template元素 / 295
15.1.3 應用模板 / 296
15.2 Shadow DOM組件 / 297
15.2.1 認識Shadow DOM / 297
15.2.2 創建Shadow DOM / 298
15.2.3 使用slot元素 / 300
15.2.4 設置Shadow DOM樣式 / 301
15.2.5 使用slotchange事件 / 305
15.3 自定義元素 / 306
15.3.1 認識自定義元素 / 306
15.3.2 新建自定義元素 / 307
15.3.3 派生元素類型 / 307
15.3.4 註冊自定義元素 / 308
15.3.5 生命周期響應函數 / 309
15.3.6 元素升級 / 310
15.3.7 派生內置元素類型 / 311
15.3.8 自定義元素的屬性 / 311
15.3.9 設置自定義元素的內容 / 312
15.4 HTML導入 / 313
15.5 在線支持 / 314
第16章 HTML5歷史記錄 / 315
16.1 History API基礎 / 315
16.1.1 認識History API / 315
16.1.2 使用History API / 315
16.2 案例實戰 / 317
16.2.1 設計無刷新站點導航 / 317
16.2.2 設計能回退的畫板 / 319
16.3 在線支持 / 321
第17章 HTML5訪問多媒體設備 / 322
17.1 WebRTC基礎 / 322
17.1.1 認識WebRTC / 322
17.1.2 訪問本地設備 / 323
17.2 案例實戰 / 325
17.2.1 拍照和攝像 / 325
17.2.2 錄音並壓縮 / 326
17.3 在線支持 / 329
第18章 HTML5訪問傳感器 / 330
18.1 傳感器API基礎 / 330
18.1.1 認識傳感器API / 330
18.1.2 方向事件和移動事件 / 330
18.1.3 瀏覽器支持 / 332
18.1.4 應用場景 / 332
18.2 案例實戰 / 332
18.2.1 記錄搖手機的次數 / 332
18.2.2 重力測試小游戲 / 334
18.3 在線支持 / 335
第19章 HTML5訪問位置 / 336
19.1 Geolocation API基礎 / 336
19.1.1 Geolocation API應用場景 / 336
19.1.2 位置信息來源 / 336
19.1.3 位置信息表示方式 / 336
19.1.4 獲取位置信息 / 337
19.1.5 瀏覽器兼容性 / 338
19.1.6 監測位置信息 / 339
19.1.7 停止獲取位置信息 / 339
19.1.8 保護隱私 / 339
19.1.9 處理位置信息 / 340
19.1.10 使用position / 340
19.2 案例實戰 / 341
19.2.1 定位手機位置 / 341
19.2.2 獲取經緯度及其詳細地址 / 342
19.2.3 輸入提示查詢位置 / 343
19.2.4 從當前位置查詢指定位置路線 / 344
19.2.5 記錄行蹤路線 / 345
19.3 在線支持 / 347
第20章 HTML5拖放操作 / 348
20.1 拖放API基礎 / 348
20.1.1 定義拖放功能 / 348
20.1.2 認識DataTransfer對象 / 350
20.2 案例實戰 / 353
20.3 在線支持 / 355
第21章 HTML5通知和顯示 / 356
21.1 通知API / 356
21.1.1 Notification API基礎 / 356
21.1.2 案例:設計桌面通知 / 358
21.1.3 案例:關閉通知 / 358
21.1.4 案例:設計多條通知 / 359
21.2 頁面可見API / 360
21.2.1 Page Visibility API基礎 / 360
21.2.2 案例:設計視頻頁面 / 362
21.3 全屏API / 363
21.3.1 Fullscreen API基礎 / 363
21.3.2 案例:設計全屏播放 / 365
21.4 在線支持 / 366
■下冊 · CSS3篇
第22章 CSS3基礎 / 367
22.1 CSS3概述 / 367
22.1.1 CSS歷史 / 367
22.1.2 CSS3模塊 / 368
22.1.3 CSS3特性 / 368
22.1.4 瀏覽器兼容性 / 369
22.2 CSS3選擇器概述 / 369
22.3 使用CSS3選擇器 / 371
22.3.1 兄弟選擇器 / 371
22.3.2 屬性選擇器 / 372
22.3.3 偽類選擇器 / 373
22.3.4 偽對象選擇器 / 374
22.4 案例實戰 / 375
22.5 在線支持 / 379
第23章 CSS3文本 / 380
23.1 CSS3文本模塊 / 380
23.1.1 文本模塊概述 / 380
23.1.2 文本溢出 / 381
23.1.3 文本換行 / 381
23.1.4 書寫模式 / 382
23.1.5 initial值 / 383
23.1.6 inherit值 / 384
23.1.7 unset值 / 385
23.1.8 all屬性 / 385
23.1.9 opacity屬性 / 385
23.1.10 transparent值 / 386
23.1.11 currentColor值 / 387
23.1.12 rem值 / 387
23.1.13 font-size-adjust屬性 / 388
23.2 色彩模式 / 388
23.2.1 rgba()函數 / 389
23.2.2 hsl()函數 / 389
23.2.3 hsla()函數 / 390
23.3 文本陰影 / 390
23.4 動態生成內容 / 392
23.5 網絡字體 / 393
23.6 案例實戰 / 395
23.7 在線支持 / 398
第24章 CSS3背景 / 399
24.1 背景圖像 / 399
24.1.1 設置定位原點 / 399
24.1.2 設置裁剪區域 / 400
24.1.3 設置背景圖像大小 / 401
24.1.4 設置多重背景圖像 / 402
24.2 漸變背景 / 403
24.2.1 定義線性漸變 / 404
24.2.2 定義重復線性漸變 / 407
24.2.3 定義徑向漸變 / 408
24.2.4 定義重復徑向漸變 / 412
24.3 案例實戰 / 413
24.3.1 設計條紋 / 413
24.3.2 設計紋理 / 415
24.3.3 設計折角效果 / 416
24.3.4 設計圖標 / 417
24.4 在線支持 / 418
第25章 CSS3用戶接口 / 419
25.1 界面顯示 / 419
25.1.1 顯示方式 / 419
25.1.2 調整尺寸 / 420
25.1.3 縮放比例 / 421
25.2 輪廓 / 421
25.3 邊框 / 423
25.3.1 定義圖像源 / 423
25.3.2 定義平鋪方式 / 424
25.3.3 定義寬度 / 425
25.3.4 定義分割方式 / 425
25.3.5 定義擴展 / 426
25.3.6 定義圓角 / 427
25.4 盒子陰影 / 429
25.5 案例實戰 / 431
25.6 在線支持 / 434
第26章 CSS3佈局 / 435
26.1 舊版彈性盒 / 435
26.1.1 啟動彈性盒 / 435
26.1.2 設置寬度 / 435
26.1.3 設置順序 / 437
26.1.4 設置方向 / 438
26.1.5 設置對齊方式 / 439
26.2 新版彈性盒 / 440
26.2.1 認識Flexbox系統 / 440
26.2.2 啟動彈性盒 / 441
26.2.3 設置主軸方向 / 442
26.2.4 設置行數 / 443
26.2.5 設置對齊方式 / 444
26.2.6 設置彈性項目 / 445
26.3 多列佈局 / 448
26.3.1 設置列寬 / 448
26.3.2 設置列數 / 448
26.3.3 設置間距 / 449
26.3.4 設置列邊框 / 450
26.3.5 設置跨列顯示 / 450
26.3.6 設置列高度 / 451
26.4 案例實戰 / 451
26.5 在線支持 / 454
第27章 CSS3動畫 / 455
27.1 元素變形 / 455
27.1.1 認識Transform / 455
27.1.2 設置原點 / 455
27.1.3 2D旋轉 / 456
27.1.4 2D縮放 / 457
27.1.5 2D平移 / 457
27.1.6 2D傾斜 / 458
27.1.7 2D矩陣 / 458
27.1.8 設置變形類型 / 459
27.1.9 設置透視距離和原點 / 459
27.1.10 3D平移 / 462
27.1.11 3D縮放 / 463
27.1.12 3D旋轉 / 463
27.1.13 透視函數 / 464
27.1.14 變形原點 / 465
27.1.15 背景可見 / 465
27.2 過渡動畫 / 465
27.2.1 設置過渡屬性 / 466
27.2.2 設置過渡時間 / 466
27.2.3 設置延遲過渡時間 / 467
27.2.4 設置過渡動畫類型 / 467
27.2.5 設置過渡觸發動作 / 468
27.3 幀動畫 / 472
27.3.1 設置關鍵幀 / 472
27.3.2 設置動畫屬性 / 473
27.4 案例實戰 / 475
27.5 在線支持 / 476
第28章 CSS3媒體查詢 / 477
28.1 媒體查詢基礎 / 477
28.1.1 媒體類型和媒體查詢 / 477
28.1.2 使用@media / 478
28.1.3 應用@media / 479
28.2 案例實戰 / 482
28.2.1 設計響應式菜單 / 482
28.2.2 設計自動隱藏的欄目 / 483
28.2.3 設計自適應的頁面 / 486
28.3 在線支持 / 489
第29章 CSS3項目實戰 / 490