《HTML5+CSS3網頁設計與布局經典課堂》是2019年2月清華大學出版社出版的圖書，作者是金松河、劉柏生。
基本介紹
- 書名：HTML5+CSS3網頁設計與布局經典課堂
- 作者：金松河、劉柏生
- 出版社：清華大學出版社
- 出版時間：2019年2月
- 定價：69 元
- ISBN：9787302517795
內容簡介,圖書目錄,
內容簡介
《HTML5+CSS3 網頁設計與布局經典課堂》以HTML 和CSS 為寫作基礎，以“理論知識+實操案例”為創作導向，圍繞網頁設計的基本知識展開講解。書中的每個案例都給出了詳細的實現代碼，同時還對代碼中的關鍵點和效果實現進行了描述。
《HTML5+CSS3 網頁設計與布局經典課堂》共12 章，分別對canvas 繪圖基礎、HTML5 表單元素、HTML5 表單製作、HTML5 多媒體套用、地理位置的獲取、離線儲存和拖放、CSS3 中的選擇器、CSS3 的顏色和圖形的套用、CSS3 中的動畫及用戶互動界面設計進行了詳細的我闡述。本書結構清晰，思路明確，內容豐富，語言簡練，既有鮮明的基礎性，也有很強的實用性。
《HTML5+CSS3 網頁設計與布局經典課堂》既可作為大中專院校及高等院校相關專業的教學用書，又可作為網頁設計愛好者的學習用書。同時，也可以作為社會各類網頁設計及Web 前端開發培訓班的首選教材。
圖書目錄
Chapter / 01
HTML5 輕鬆上手
1.1 HTML5 新增知識 2
1.1.1 HTML5 的兼容性 2
1.1.2 HTML5 的通用訪問 2
1.1.3 HTML5 標準改進 2
1.2 HTML5 語法 3
1.2.1 文檔類型聲明 3
1.2.2 字元編碼 4
1.2.3 省略引號 4
1.3 HTML5 元素分類 4
1.3.1 結構性元素4
1.3.2 級塊性元素5
1.3.3 行內語義性元素 5
1.3.4 互動性元素5
1.4 HTML5 新增主體結構元素 6
1.4.1 article 元素6
1.4.2 section 元素 7
1.4.3 nav 元素 8
1.4.4 aside 元素9
1.4.5 pubdate 屬性 10
1.5 HTML5 新的非主體結構元素 12
1.5.1 header 元素 12
1.5.2 hgroup 元素 13
1.5.3 footer 元素 14
1.5.4 address 元素 16
1.6 新增的屬性 17
1.6.1 表單相關屬性 17
1.6.2 其他相關屬性 17
1.7 課堂練習 18
強化訓練 20
Chapter / 02
使用canvas 繪圖
2.1 canvas 入門 22
2.1.1 什麼是canvas 22
2.1.2 瀏覽器對canvas 的支持情況 23
2.1.3 CSS 和canvas 24
2.1.4 canvas 坐標 24
2.2 怎樣使用canvas 24
2.2.1 在頁面中加入canvas 25
2.2.2 繪製矩形和三角形 27
2.3 canvas 繪製曲線路徑 30
2.3.1 路徑30
2.3.2 描邊樣式 32
2.3.3 填充樣式 34
2.3.4 繪製曲線 35
2.4 canvas 繪製圖像 38
2.4.1 插入圖像38
2.4.2 繪製漸變圖形 39
2.4.3 繪製變形圖形 42
2.4.4 組合多個圖形 44
2.4.5 圖形的縮放 46
2.4.6 像素處理 47
2.5 canvas 文本套用 48
2.5.1 繪製文本48
2.5.2 套用陰影 49
2.6 課堂練習 50
強化訓練 52
Chapter / 03
製作新型表單
3.1 認識HTML5 form 54
3.1.1 HTML5 form 新特性 54
3.1.2 瀏覽器對HTML5 form 的支持情況 54
3.1.3 新型表單的輸入型控制項 55
3.2 表單新屬性 58
3.2.1 新的表單元素 58
3.2.2 新增表單屬性 60
3.3 HTML5 中form 套用 64
3.4 課堂練習 66
強化訓練 68
Chapter / 04
多媒體的套用
4.1 認識audio 和video 元素 70
4.2 audio 和video 元素的套用 70
4.2.1 檢測瀏覽器是否支持 70
4.2.2 audio 元素 71
4.2.3 使用audio 元素 72
4.2.4 video 元素 73
4.2.5 使用video 元素 74
4.3 audio 和video 屬性、方法和事件 75
4.3.1 audio 和video 相關事件 75
4.3.2 audio 和video 相關屬性 76
4.3.3 audio 和video 相關方法 76
4.4 課堂練習 77
強化訓練 78
Chapter / 05
獲取地理位置
5.1 關於地理位置信息 80
5.1.1 經度和緯度坐標 80
5.1.2 IP 地址定位數據 80
5.1.3 GPS 地理定位數據 80
5.1.4 wi-fi 地理定位數據 81
5.1.5 用戶自定義的地理定位 81
5.2 瀏覽器對Geolocation 的支持 81
5.2.1 GeolocationAPI 必學知識 81
5.2.2 Geolocation 的瀏覽器支持情況 84
5.3 隱私處理 84
5.3.1 套用隱私保護機制 84
5.3.2 處理位置信息 85
5.4 使用GeolocationAPI 85
5.4.1 檢測瀏覽器是否支持 85
5.4.2 位置請求 86
5.5 在地圖上顯示你的位置 89
5.6 課堂練習 92
強化訓練 94
Chapter / 06
本地儲存和上傳
6.1 離線Web 入門 96
6.1.1 離線Web 介紹 96
6.1.2 離線Web 套用的瀏覽器支持情況 96
6.2 使用離線Web 96
6.2.1 支持離線行為 97
6.2.2 manifest 檔案介紹 98
6.2.3 applicationCache 對象 99
6.2.4 離線Web 的具體套用 101
6.3 Web Workers 知識 102
6.3.1 什麼是Web Workers 102
6.3.2 W eb Workers 的簡單套用 103
6.4 使用Web Workers API 105
6.4.1 檢測瀏覽器是否支持 105
6.4.2 創建Web Workers 106
6.4.3 多執行緒檔案的載入與執行 106
6.4.4 與Web Workers 通信 106
6.5 拖放API 108
6.5.1 實現拖放API 的過程 108
6.5.2 datatransfer 對象的屬性與方法 108
6.6 拖放API 的套用 109
6.6.1 拖放套用109
6.6.2 拖放列表 111
6.7 課堂練習 114
強化訓練 117
Chapter / 07
新增的選擇器
7.1 回顧CSS 120
7.1.1 什麼是CSS 120
7.1.2 CSS 特點及優點 120
7.1.3 CSS 的基本語法 120
7.2 CSS 選擇器 121
7.2.1 三大基礎選擇器 121
7.2.2 集體選擇器 124
7.2.3 屬性選擇器 126
7.3 CSS3 基礎知識 127
7.3.1 CSS3 瀏覽器的支持情況 127
7.3.2 CSS3 新增的長度單位 128
7.3.3 CSS3 新增結構性偽類 129
7.3.4 CSS3 新增UI 元素狀態偽類 135
7.3.5 CSS3 新增屬性 137
7.4 課堂練習 141
強化訓練 143
Chapter / 08
CSS3 文本與顏色
8.1 設計文本和框線樣式 146
8.1.1 文本陰影text-shadow 146
8.1.2 文本溢出text-overflow 155
8.1.3 文本換行word-wrap 156
8.1.4 單詞拆分word-break 157
8.1.5 圓角框線border-radius 158
8.1.6 盒子陰影box-shadow 160
8.1.7 邊界框線border-image 161
8.2 設計顏色樣式 163
8.2.1 使用RGBA 顏色值 163
8.2.2 使用HSL 顏色值 164
8.2.3 使用HSLA 顏色值 168
8.3 課堂練習 169
強化訓練 171
Chapter / 09
顏色漸變和圖形轉換
9.1 漸變簡介 174
9.1.1 瀏覽器支持 174
9.1.2 線性漸變175
9.1.3 徑向漸變178
9.2 CSS3 轉換 180
9.2.1 瀏覽器支持情況 180
9.2.2 2D 轉換180
9.2.3 3D 轉換187
9.3 課堂練習 192
強化訓練 194
Chapter / 10
讓設計更加靈活
10.1 盒子模型 196
10.1.1 CSS 中的盒子簡介 196
10.1.2 外邊距設定 196
10.1.3 外邊距合併 199
10.1.4 內邊距設定 202
10.2 彈性盒子 202
10.2.1 彈性盒子基礎 203
10.2.2 瀏覽器支持情況 203
10.2.3 對父級容器的設定 203
10.2.4 對子級內容的設定 212
10.3 課堂練習 217
強化訓練 219
Chapter / 11
CSS3 設計動畫
11.1 過渡基礎 222
11.1.1 過渡屬性 222
11.1.2 瀏覽器支持情況 222
11.2 實現過渡 223
11.2.1 單項屬性過渡 223
11.2.2 多項屬性過渡 224
11.2.3 利用過渡設計電腦桌面 226
11.3 實現動畫 228
11.3.1 瀏覽器支持 228
11.3.2 動畫屬性 229
11.3.3 實現動畫效果 230
11.3.4 利用動畫屬性製作太陽系動畫 233
11.4 課堂練習 236
強化訓練 237
Chapter / 12
用戶互動界面
12.1 多媒體查詢 240
12.1.1 多媒體查詢能做什麼 240
12.1.2 多媒體查詢語法 240
12.1.3 多媒體查詢方法 240
12.1.4 製作一個自適應的導航欄 243
12.2 用戶界面簡介 247
12.2.1 調整尺寸resizing 247
12.2.2 方框大小調整box-sizing 249
12.2.3 外形修飾outline-offset 252
12.2.4 界面的多列布局 253
12.3 課堂練習 256
強化訓練 258
參考文獻 259
