《HTML5+CSS3網頁設計基礎教程》是2018年1月清華大學出版社出版的圖書，作者是石磊、王維哲、李娜、謝昆鵬、王鵬程。
基本介紹
- 中文名：HTML5+CSS3網頁設計基礎教程
- 作者：石磊、王維哲、李娜、謝昆鵬、王鵬程
- 出版社：清華大學出版社
- 出版時間：2018年1月
- 定價：58 元
- ISBN：9787302490913
內容簡介,圖書目錄,
內容簡介
《HTML5+CSS3網頁設計基礎教程》全面講述了HTML5+CSS3網頁設計基礎知識體系。全書共分為18章，主要內容包括：Web開發概述、HTML/XHTML/HTML5發展歷程、HTML5文檔的創建、HTML5表單的使用、圖形/圖像的繪製、音頻與視頻的播放與控制、本地存儲體系、離線套用開發、Web Workers多執行緒處理、CSS3選擇器、文本及修飾、背景和框線處理、變形與動畫、網頁布局等，並且運用大量實例對各種關鍵技術進行深入淺出的分析。
《HTML5+CSS3網頁設計基礎教程》內容豐富、結構合理、思路清晰、語言簡練流暢、示例翔實。本書面向期望學習HTML和CSS的Web開發人員，適合作為高等院校相關專業的教材，也適合從事網頁設計製作和網站建設的人員學習。
圖書目錄
第1章 Web開發新時代 1
1.1 HTML5概述 1
1.1.1 HTML5的目標 1
1.1.2 HTML5新特性 2
1.1.3 HTML5深受歡迎的原因 3
1.1.4 HTML5的構成 4
1.2 HTML5設計原理 5
1.2.1 HTML的歷史變遷 5
1.2.2 HTML5開發動力 6
1.3 編寫第一個HTML5頁面 7
1.3.1 搭建上機練習環境 7
1.3.2 檢測瀏覽器是否支持 7
1.3.3 使用HTML5編寫簡單的Web
頁面 8
1.4 HTML5頁面的特徵 9
1.4.1 使用HTML5的結構化元素 9
1.4.2 使用CSS美化HTML5文檔 12
1.5 本章小結 13
1.6 思考和練習 13
第2章 HTML、XHTML、HTML5 14
2.1 HTML基礎 14
2.1.1 HTML簡介 14
2.1.2 HTML結構 15
2.1.3 HTML語法 15
2.2 XHTML基礎 17
2.2.1 XHTML結構 17
2.2.2 XHTML語法 18
2.2.3 XHTML類型 18
2.2.4 DTD解析 19
2.2.5 命名空間 21
2.3 HTML5基礎 21
2.3.1 HTML5語法 21
2.3.2 HTML5元素 22
2.4 新增和廢除的屬性 25
2.4.1 新增的屬性 25
2.4.2 廢除的屬性 27
2.5 全局屬性 28
2.5.1 contentEditable屬性 28
2.5.2 designMode屬性 29
2.5.3 hidden屬性 29
2.5.4 spellcheck屬性 29
2.5.5 tabindex屬性 29
2.6 新增的事件 29
2.7 本章小結 30
2.8 思考和練習 30
第3章 創建HTML5文檔 31
3.1 認識HTML5文檔結構 31
3.2 HTML5元素分類 33
3.3 構建主體內容 34
3.3.1 標識文章：article元素 34
3.3.2 給內容分塊：section元素 36
3.3.3 設計導航信息：nav元素 37
3.3.4 設計輔助信息：aside元素 39
3.3.5 設計微格式：time元素 40
3.3.6 添加發布日期：pubdate屬性 41
3.4 添加語義模組 41
3.4.1 添加標題塊：header元素 41
3.4.2 給標題分組：hgroup元素 42
3.4.3 添加腳註塊：footer元素 43
3.4.4 添加聯繫信息：address元素 44
3.5 本章小結 44
3.6 思考和練習 45
第4章 HTML5表單 46
4.1 新增的表單屬性 46
4.1.1 autocomplete屬性 46
4.1.2 novalidate屬性 47
4.2 新增的表單元素 47
4.2.1 datalist元素 47
4.2.2 keygen元素 48
4.2.3 output元素 49
4.3 新增的輸入類型 49
4.3.1 email類型 50
4.3.2 url類型 51
4.3.3 number類型 51
4.3.4 Date Pickers類型 52
4.3.5 search類型 56
4.3.6 tel類型 57
4.3.7 color類型 57
4.4 新增的輸入屬性 58
4.4.1 form屬性 58
4.4.2 formaction屬性 59
4.4.3 formmethod屬性 59
4.4.4 formenctype屬性 59
4.4.5 formtarget屬性 60
4.4.6 autofocus屬性 60
4.4.7 required屬性 60
4.4.8 labels屬性 61
4.4.9 control屬性 62
4.4.10 placeholder屬性 63
4.4.11 list屬性 63
4.4.12 文本框的pattern屬性 64
4.4.13 selectionDirection屬性 64
4.4.14 複選框的indeterminate屬性 65
4.4.15 height與width屬性 66
4.4.16 maxlength和wrap屬性 67
4.5 表單驗證 67
4.5.1 自動驗證 67
4.5.2 取消驗證 68
4.5.3 顯式驗證 68
4.6 本章小結 69
4.7 思考和練習 69
第5章 圖形/圖像的繪製 70
5.1 canvas元素基礎 70
5.1.1 添加canvas元素 70
5.1.2 檢測瀏覽器是否支持 71
5.1.3 使用canvas元素繪製圖形 71
5.1.4 canvas坐標系 73
5.2 繪製簡單圖形 73
5.2.1 繪製直線 73
5.2.2 繪製矩形 74
5.2.3 繪製弧線與圓形 75
5.2.4 繪製三角形 78
5.2.5 清空畫布 78
5.3 繪製貝塞爾曲線 79
5.3.1 二次貝塞爾曲線 79
5.3.2 三次貝塞爾曲線 80
5.4 繪製變形圖形 81
5.4.1 保存與恢復canvas狀態 81
5.4.2 移動坐標空間 82
5.4.3 旋轉坐標空間 84
5.4.4 縮放圖形 86
5.4.5 矩陣變換 86
5.5 豐富圖形效果 89
5.5.1 套用不同的線型 89
5.5.2 繪製線性漸變 90
5.5.3 繪製徑向漸變 91
5.5.4 繪製圖案 92
5.5.5 設定圖形的透明度 93
5.5.6 創建陰影 93
5.6 圖像處理 95
5.6.1 裁剪圖像 95
5.6.2 像素處理 96
5.6.3 組合圖形 98
5.6.4 混合圖像 100
5.7 繪製文字 101
5.7.1 繪製填充文字 101
5.7.2 文字相關屬性 101
5.7.3 繪製輪廓文字 102
5.7.4 獲取文字寬度 102
5.7.5 文字繪製實戰 102
5.8 本章小結 103
5.9 思考和練習 103
第6章 音頻與視頻 104
6.1 HTML5多媒體技術概述 104
6.1.1 關於編解碼器 105
6.1.2 音頻編解碼器 105
6.1.3 視頻編解碼器 106
6.2 瀏覽器音視頻支持檢測 107
6.3 audio與video元素 109
6.3.1 audio元素 109
6.3.2 video元素 111
6.4 綜合實戰 112
6.4.1 用腳本控制音樂播放 112
6.4.2 用腳本控制視頻播放 114
6.5 為音頻或視頻添加字幕 115
6.5.1 track元素的基礎知識 115
6.5.2 track元素的各種屬性 116
6.5.3 WebVTT檔案 117
6.6 本章小結 120
6.7 思考和練習 121
第7章 本地存儲 122
7.1 Web存儲 122
7.1.1 Cookie存儲機制的優缺點 122
7.1.2 為什麼要用Web存儲 122
7.1.3 Web存儲的優缺點 123
7.2 使用Web存儲 123
7.2.1 檢查瀏覽器的支持性 123
7.2.2 設定和獲取數據 124
7.2.3 Web存儲的其他操作 124
7.2.4 監測Web存儲事件 125
7.2.5 製作簡單的網頁皮膚 127
7.2.6 網站人氣值和線上人數統計 128
7.3 本地資料庫 129
7.3.1 本地資料庫的基本概念 129
7.3.2 用executeSql執行查詢 129
7.3.3 創建一個簡單的資料庫 131
7.3.4 綜合套用——點評功能 132
7.4 本章小結 138
7.5 思考和練習 138
第8章 離線應用程式 139
8.1 離線Web應用程式詳解 139
8.1.1 本地快取技術產生的原因 139
8.1.2 本地快取概述 139
8.1.3 本地快取與瀏覽器網頁快取的
區別 140
8.1.4 瀏覽器支持檢測 141
8.2 HTML5離線套用詳解 141
8.2.1 Web伺服器配置 141
8.2.2 manifest檔案結構與含義 142
8.2.3 搭建離線應用程式 143
8.2.4 離線套用中瀏覽器和伺服器的
互動過程 143
8.3 applicationCache對象 145
8.3.1 swapCache方法 145
8.3.2 applicationCache對象的事件 146
8.4 快取網站的首頁 149
8.4.1 新建HTML5頁面 149
8.4.2 添加.htaccess支持 149
8.4.3 創建manifest檔案 150
8.4.4 關聯manifest檔案到HTML5
頁面 150
8.4.5 測試離線套用 150
8.5 本章小結 151
8.6 思考和練習 151
第9章 Web Workers多執行緒處理 152
9.1 認識Web Workers 152
9.1.1 HTML4處理長耗時操作的
問題 152
9.1.2 HTML5針對長耗時操作的
解決方法 152
9.1.3 Web Workers的使用示例 153
9.1.4 Web Workers的使用場合 155
9.2 使用Web Workers 155
9.2.1 檢查瀏覽器支持情況 155
9.2.2 與執行緒進行數據互動 156
9.3 執行緒的嵌套 158
9.3.1 單層嵌套 158
9.3.2 在多個子執行緒中進行數據
互動 160
9.4 執行緒中可用的變數、函式
與類 161
9.5 共享執行緒 162
9.5.1 基礎知識 162
9.5.2 與共享執行緒通信 163
9.6 執行緒的工作原理 163
9.6.1 執行緒事件處理模型 163
9.6.2 執行緒的套用範圍和作用域 164
9.6.3 執行緒的生命周期 164
9.7 綜合實戰 165
9.7.1 使用執行緒做後台數值計算 165
9.7.2 使用共享執行緒處理多用戶並發
連線 167
9.7.3 HTML5 執行緒代理 168
9.8 本章小結 171
9.9 思考和練習 171
第10章 Geolocation地理位置 172
10.1 Geolocation API的基本知識 172
10.1.1 位置信息的表示方式 172
10.1.2 位置信息的來源 173
10.2 使用Geolocation API 174
10.2.1 檢測瀏覽器支持情況 174
10.2.2 獲取當前地理位置 174
10.2.3 持續監視位置信息 176
10.2.4 停止獲取位置信息 176
10.2.5 隱私保護 176
10.2.6 處理位置信息 177
10.2.7 position對象 177
10.3 使用百度地圖 178
10.4 本章小結 182
10.5 思考和練習 182
第11章 CSS3概述 183
11.1 CSS的歷史變遷 183
11.1.1 CSS產生的原因 183
11.1.2 CSS的發展歷史 184
11.1.3 Hello CSS World 185
11.1.4 為文檔套用CSS的方式 187
11.2 了解CSS3新增特性 188
11.2.1 CSS3選擇器 188
11.2.2 引用伺服器端字型 189
11.2.3 換行處理 190
11.2.4 文字渲染 191
11.2.5 多欄布局 191
11.2.6 框線和顏色 191
11.2.7 漸變效果 192
11.2.8 陰影和反射效果 193
11.2.9 背景效果 194
11.2.10 盒子模型 195
11.2.11 過渡、形變與動畫 197
11.3 CSS3兼容性速查 199
11.4 本章小結 199
11.5 思考和練習 200
第12章 CSS3選擇器 201
12.1 選擇器的用法 201
12.2 屬性選擇器 202
12.2.1 CSS2定義的屬性選擇器 202
12.2.2 CSS3定義的屬性選擇器 202
12.2.3 案例實戰 203
12.3 結構偽類選擇器 205
12.3.1 CSS中的偽類選擇器及偽元素 205
12.3.2 root、not、empty和target 205
12.3.3 first-child、last-child、nth-
child(n)和nth-last-child(n) 207
12.3.4 first-of-type和last-of-type 209
12.3.5 nth-of-type(n)和nth-last-of-type(n) 210
12.3.6 only-child選擇器 211
12.4 UI元素狀態偽類選擇器 212
12.4.1 UI元素狀態偽類選擇器的語法 212
12.4.2 E:hover、E:active和E:focus 213
12.4.3 E:enabled與E:disabled 214
12.4.4 E:read-only與E:read-write 214
12.4.5 E:checked、E:default和E:indeterminate 215
12.4.6 E::selection 216
12.4.7 E:invalid與E:valid 217
12.4.8 E:required與E:optional 218
12.4.9 E:in-range與E:out-of-range 219
12.5 本章小結 219
12.6 思考和練習 220
第13章 CSS3文本屬性 221
13.1 CSS3文本屬性概述 221
13.2 設計文本陰影 221
13.2.1 text-shadow屬性的使用方法 222
13.2.2 一般文字陰影效果 222
13.2.3 文字凹凸效果 223
13.2.4 為文本指定多個陰影 224
13.3 設定文本樣式 224
13.3.1 text-stroke屬性 225
13.3.2 文本溢出 225
13.3.3 強制換行——word-wrap屬性 227
13.3.4 嵌入字型——@font-face 228
13.3.5 字型尺寸——font-size-adjust屬性 229
13.4 顏色模式 232
13.4.1 關鍵字 232
13.4.2 十六進制 233
13.4.3 RGB模式 233
13.4.4 RGBA模式 233
13.4.5 HSL模式 233
13.4.6 HSLA模式 234
13.5 本章小結 234
13.6 思考和練習 234
第14章 背景和框線 235
14.1 設計多色框線 235
14.1.1 用法詳解 235
14.1.2 案例實戰 236
14.2 設計框線背景 237
14.2.1 border-image屬性 237
14.2.2 border-image繪製原理簡述 238
14.3 設計圓角 238
14.3.1 border-radius屬性 238
14.3.2 border-radius屬性的4種寫法 239
14.3.3 用border-radius屬性畫實心半圓和實心圓 240
14.4 設計陰影 242
14.4.1 box-shadow屬性 242
14.4.2 box-shadow兼容性處理 242
14.4.3 案例實戰 243
14.5 設計背景 245
14.5.1 background-image屬性 246
14.5.2 background-position屬性 246
14.5.3 background-size屬性 247
14.5.4 background-origin屬性 249
14.5.5 background-repeat屬性 250
14.5.6 background-clip屬性 250
14.5.7 background-attachment屬性 252
14.6 本章小結 252
14.7 思考和練習 252
第15章 變形處理 253
15.1 認識transform屬性 253
15.2 2D變形 254
15.2.1 旋轉 254
15.2.2 縮放 254
15.2.3 移動 255
15.2.4 扭曲 256
15.2.5 複雜變形 257
15.3 3D變形 260
15.3.1 3D位移 261
15.3.2 3D旋轉 264
15.3.3 3D縮放 267
15.3.4 3D變形兼容性 268
15.3.5 多重變形 269
15.4 變形矩陣 275
15.4.1 矩陣概述 276
15.4.2 變形與坐標系統 276
15.4.3 2D矩陣變形 276
15.4.4 3D矩陣變形 278
15.4.5 使用矩陣實現多重變形 279
15.5 本章小結 280
15.6 思考和練習 280
第16章 設計動畫 282
16.1 過渡動畫 282
16.1.1 定義過渡屬性 283
16.1.2 定義過渡時間 284
16.1.3 定義過渡延遲時間 285
16.1.4 定義過渡效果 286
16.2 3D動畫 288
16.2.1 定義動畫名稱 288
16.2.2 定義動畫時間 288
16.2.3 定義動畫播放方式 288
16.2.4 定義動畫延遲時間 288
16.2.5 定義動畫播放次數 289
16.2.6 定義動畫播放方向 289
16.2.7 控制播放狀態 289
16.2.8 翻轉的圖片 289
16.3 漸變效果 290
16.3.1 線性漸變在WebKit下的套用 290
16.3.2 線性漸變在Mozilla下的套用 291
16.3.3 線性漸變在Opera下的套用 292
16.3.4 線性漸變在IE下的套用 292
16.4 案例綜合實戰 292
16.4.1 設計級聯選單 292
16.4.2 設計實用按鈕 297
16.5 本章小結 299
16.6 思考和練習 299
第17章 網頁布局 300
17.1 多欄布局 300
17.1.1 設定列寬和列數 300
17.1.2 設定列間距 303
17.1.3 設定列框線 303
17.1.4 設定跨列標題 304
17.1.5 統一列高 305
17.2 盒布局 305
17.2.1 CSS盒子模型 305
17.2.2 使用盒布局 306
17.2.3 盒布局和多欄布局的區別 309
17.3 彈性盒布局 309
17.3.1 對多個元素使用flex屬性 309
17.3.2 設定元素的顯示順序 310
17.3.3 設定元素的排列方向 312
17.3.4 定義寬高自適應 312
17.3.5 消除空白 314
17.3.6 靈活使用flex屬性 315
17.3.7 控制換行方向 320
17.4 彈性盒布局的布局原理 321
17.4.1 彈性盒布局概述 321
17.4.2 justify-content屬性 322
17.4.3 align-items屬性 323
17.5 本章小結 323
17.6 思考和練習 323
第18章 綜合實例 324
18.1 前端套用開發的現狀與趨勢 324
18.1.1 HTML5套用現狀 324
18.1.2 HTML5行業發展趨勢 325
18.2 網站開發流程 325
18.2.1 確定建站目標 325
18.2.2 進行需求分析 325
18.2.3 繪製網站原型 326
18.2.4 系統整理所需資料 326
18.2.5 與網站設計美工確定布局和風格 326
18.2.6 程式設計師完成網站功能實現 326
18.2.7 網站上線測試 326
18.2.8 網站推廣 327
18.3 企業網站 327
18.3.1 組織網頁結構 327
18.3.2 構建網頁標題 329
18.3.3 構建側邊欄 331
18.3.4 構建主體內容 332
18.3.5 構建版權資訊 339
18.4 手機閱讀器 339
18.4.1 使用到的技術 339
18.4.2 HTML頁面代碼分析 340
18.4.3 CSS3樣式代碼分析 343
18.4.4 JavaScript腳本代碼分析 352
18.5 本章小結 361
參考文獻 362
