基本信息
書名:HTML5與CSS3從入門到精通
作者:[美]Terry Felke-Morris
定價:69元
印次:3-1
ISBN:9787302473268
出版日期:2017.06.01
印刷日期:2017.06.13
內容介紹
本書針對HTML5和CSS3的最新標準進行及時的更新和修訂,包含的主題有:Internet和Web概念;創建HTML5網頁;用CSS配置顏色和文本;用CSS配置頁面布局;配置圖像和多媒體;探索新增的CSS3特性;套用網頁設計最佳實踐;設計可訪問和可用的網頁;搜尋引擎最佳化設計;選擇域名;發布網站。本書適合所有對網頁設計感興趣的讀者閱讀,是一本理想的入門參考。
目 錄
第1章 網際網路和全球資訊網基礎 1
1.1 網際網路和全球資訊網 2
網際網路 2
網際網路的誕生 2
網際網路的發展 2
全球資訊網的誕生 2
第一個圖形化瀏覽器 3
各種技術的聚合 3
1.2 網頁標準和無障礙訪問 4
W3C推薦標準 4
網頁標準和無障礙訪問 4
無障礙訪問和法律 4
網頁通用設計 5
1.3 瀏覽器和伺服器 6
網路概述 6
客戶端/伺服器模型 6
1.4 Internet協定 8
電子郵件協定 8
超文本傳輸協定 8
檔案傳輸協定 8
傳輸控制協定/Internet協定 8
IP位址 9
1.5 統一資源標識符(URI)和域名 10
URI和URL 10
域名 10
頂級域名 11
通用頂級域名 11
國家代碼頂級域名 12
域名系統DNS 13
1.6 網上的信息 14
網上的信息可靠嗎? 14
網上的信息是最新的嗎? 15
有沒有指向其他資源的外部連結? 15
1.7 HTML概述 16
什麼是HTML? 16
什麼是XML? 17
什麼是XHTML? 17
HTML的最新版本HTML5 17
1.8 網頁幕後揭秘 18
文檔類型定義(DTD) 18
網頁模板 18
html元素 18
頁頭區域 19
主體區域 19
1.9 第一個網頁 20
動手實作1.1 20
新建資料夾 20
保存檔案 21
測試網頁 22
複習和練習 23
複習題 23
動手練習 23
網上調研 24
聚焦網頁設計 24
第2章HTML基礎 25
2.1標題元素 26
動手實作2.1 26
無障礙訪問和標題 27
HTML5更多的標題選項 27
2.2段落元素 28
動手實作2.2 28
對齊 29
2.3換行和水平標尺 30
換行元素 30
動手實作2.3 30
水平標尺元素 31
動手實作2.4 31
2.4塊引用元素 32
動手實作2.5 33
2.5短語元素 34
2.6有序列表 36
type屬性,start屬性和
reversed屬性 36
動手實作2.6 37
2.7無序列表 38
動手實作2.7 39
2.8描述列表 40
動手實作2.8 41
2.9特殊字元 42
動手實作2.9 42
2.10HTML語法校驗 44
動手實作2.10 44
2.11結構元素 46
div元素 46
header元素 46
nav元素 46
main元素 46
footer元素 46
動手實作2.11 47
2.12練習使用結構元素 48
動手實作2.12 48
2.13錨元素 50
動手實作2.13 50
連結目標 51
絕對連結 51
相對連結 51
blockanchor 51
2.14練習使用連結 52
站點地圖 52
動手實作2.14 52
2.15電子郵件連結 56
動手實作2.15 57
複習和練習 58
複習題 58
動手練習 59
聚焦網頁設計 59
案例分析 59
PacificTrailsResort案例分析 60
JavaJamCoffeeHouse案例分析 62
第3章網頁設計基礎 67
3.1為目標客群設計 68
瀏覽器 69
螢幕解析度 69
3.2網站組織 70
分級式組織 70
線性組織 71
隨機組織 71
3.3視覺設計原則 72
重複:在整個設計中重複視覺元素 72
對比:添加視覺刺激和吸引注意力 73
近似:分組相關項目 73
對齊:對齊元素實現視覺上的統一 73
3.4提供無障礙訪問 74
通用設計和增強無障礙訪問的
受益者 74
無障礙設計有助於提高在搜尋
引擎中的排名 74
法律規定 75
無障礙設計的熱潮 75
3.5文本的使用 76
文本設計的注意事項 76
3.6調色板 78
十六進制顏色值 78
網頁安全色 78
無障礙設計和顏色 79
3.7針對目標客群進行設計 80
面向兒童 80
面向年輕人 80
面向所有人 81
面向老年人 81
3.8選擇顏色方案 83
以一張圖片為基礎的方案 83
色輪 84
變深、變淺和變灰 84
單色 85
相似色 85
互補色 86
分散互補色 86
三色 86
四色 87
實現顏色方案 87
3.9使用圖片和多媒體 88
檔案大小和圖片尺寸 88
抗鋸齒/鋸齒化文本的問題 88
只使用必要的多媒體 89
提供替代文本 89
3.10更多設計考慮 90
感覺到的載入時間 91
第一屏 91
適當留白 91
水平滾動 91
3.11導航設計 92
網站要易於導航 92
導航欄 92
圖片導航 93
動態導航 93
站點地圖 93
站點搜尋功能 94
3.12線框和頁面布局 95
3.13固定和流動布局 98
固定布局 98
流動布局 99
3.14為行動網路設計 100
三種方式 100
移動設備設計考慮 100
桌面和移動網站的例子 101
移動設計小結 101
3.15靈活回響的網頁設計 102
3.16網頁設計最佳實踐 104
複習和練習 106
複習題 106
動手練習 107
聚焦網頁設計 107
網頁項目案例分析 108
項目里程碑 108
第4章CSS基礎 111
4.1CSS概述 112
層疊樣式表的優點 112
配置CSS的方法 113
層疊樣式表的“層疊” 113
4.2CSS選擇符和聲明 114
CSS語法基礎 114
background-color屬性 114
color屬性 114
配置背景色和文本色 115
4.3CSS顏色值語法 116
4.4配置內聯CSS 118
style屬性 118
動手實作4.1 118
4.5配置嵌入CSS 120
style元素 120
動手實作4.2 121
4.6配置外部CSS 123
link元素 123
動手實作4.3 123
4.7CSS的class、ID和後代選擇符 125
class選擇符 125
id選擇符 125
後代選擇符 125
動手實作4.4 125
4.8span元素 127
span元素 127
動手實作4.5 127
4.9練習使用CSS 129
動手實作4.6 129
將嵌入CSS轉換為外部CSS 129
將網頁與外部CSS檔案關聯 129
4.10層疊 132
4.11練習使用層疊 134
動手實作4.7 134
4.12CSS語法校驗 136
動手實作4.8 136
複習和練習 138
複習題 138
動手練習 139
聚焦網頁設計 139
PacificTrailsResort案例分析 140
JavaJamCoffeeHouse案例分析 143
第5章圖形和文本樣式基礎 147
5.1圖片 148
GIF圖片 148
JPEG圖片 148
PNG圖片 149
新的WebP圖像格式 149
5.2img元素 150
動手實作5.1 150
5.3圖片連結 152
動手實作5.2 152
5.4配置背景圖片 154
background-image屬性 154
同時使用背景顏色和背景圖片 154
瀏覽器如何顯示背景圖片 154
background-attachment屬性 155
5.5定位背景圖片 156
background-repeat屬性 156
定位背景圖片 156
動手實作5.3 157
5.6用CSS3配置多張背景圖片 158
漸進式增強 158
動手實作5.4 159
5.7用CSS配置字型 160
font-family屬性 160
動手實作5.5 160
5.8CSS文本屬性 162
font-size屬性 162
font-weight屬性 162
font-style屬性 162
line-height屬性 163
text-align屬性 163
text-decoration屬性 163
text-indent屬性 163
text-transform屬性 163
letter-spacing屬性 163
5.9練習配置圖形和文本 164
動手實作5.6 164
5.10用CSS配置列表符號 166
用圖片代替列表符號 167
動手實作5.7 167
5.11收藏圖示 168
配置收藏圖示 168
動手實作5.8 168
5.12圖像映射 170
map元素 170
area元素 170
探索矩形圖像映射 170
5.13複習和練習 172
複習題 172
動手練習 173
聚焦網頁設計 174
PacificTrailsResort案例分析 174
JavaJamCoffeeHouse案例分析 178
第6章CSS進階 183
6.1寬度和高度 184
width屬性 184
min-width屬性 184
max-width屬性 184
height屬性 185
動手實作6.1 185
6.2框模型 186
內容 186
填充 186
框線 186
邊距 187
框模型實例 187
6.3邊距和填充 188
margin屬性 188
padding屬性 188
6.4框線 190
動手實作6.2 191
6.5CSS3圓角 192
動手實作6.3 193
6.6居中頁面內容 194
動手實作6.4 194
6.7CSS3的框線和文本陰影 196
CSS3的box-shadow屬性 196
CSS3的text-shadow屬性 196
動手實作6.5 197
6.8CSS3的background-clip和
background-origin屬性 198
CSS3background-clip屬性 198
CSS3background-origin屬性 199
6.9CSS3背景大小和縮放 200
6.10練習使用CSS3屬性 202
動手實作6.6 202
6.11CSS3的opacity屬性 204
動手實作6.7 204
6.12CSS3RGBA顏色 206
動手實作6.8 207
6.13CSS3HSLA顏色 208
色調、飽和度、亮度和alpha 208
HSLA顏色示例 208
動手實作6.9 209
6.14CSS3的漸變 210
線性漸變語法 210
輻射漸變語法 210
CSS3漸變和漸進式增強 211
動手實作6.10 211
複習和練習 212
複習題 212
動手練習 213
聚焦網頁設計 213
PacificTrailsResort案例分析 213
JavaJamCoffeeHouse案例分析 216
第7章頁面布局基礎 221
7.1正常流動 222
動手實作7.1 222
7.2浮動 224
float屬性 224
動手實作7.2 225
浮動元素和正常流動 225
7.3清除浮動 226
clear屬性 226
7.4溢出 228
overflow屬性 228
7.5基本雙欄布局 230
動手實作7.3 230
雙欄布局的例子 234
7.6用無序列表實現垂直導航 236
用CSS配置無序列表 236
用CSStext-decoration屬性消除
下劃線 236
動手實作7.4 237
7.7用無序列表實現水平導航 238
CSS的display屬性 238
動手實作7.5 239
7.8用偽類實現CSS互動性 240
動手實作7.6 240
7.9練習CSS雙欄布局 242
動手實作7.7 242
7.10用CSS進行定位 244
static定位 244
fixed定位 244
相對定位 244
絕對定位 245
7.11練習定位 246
動手實作7.8 246
7.12CSS精靈 248
動手實作7.9 249
複習和練習 250
複習題 250
動手練習 251
聚焦網頁設計 251
PacificTrailsResort案例分析 251
JavaJamCoffeeHouse案例分析 252
第8章連結、布局和移動
開發進階 255
8.1相對連結的更多知識 256
相對連結的例子 256
動手實作8.1 256
8.2區段標識符 258
動手實作8.2 259
8.3figure元素和figcaption元素 260
figure元素 260
figcaption元素 260
添加圖題 260
動手實作8.3 261
8.4圖片浮動練習 262
動手實作8.4 262
8.5更多HTML5元素 264
section元素 264
article元素 264
aside元素 264
time元素 264
動手實作8.5 264
8.6HTML5與舊瀏覽器的兼容性 266
配置CSS塊顯示 266
HTML5Shim 266
動手實作8.6 267
8.7CSS對列印的支持 268
列印樣式最佳實踐 268
動手實作8.7 269
8.8移動網頁設計 270
移動網頁設計要考慮的問題 270
為移動使用最佳化布局 271
最佳化移動導航 271
最佳化移動圖片 272
最佳化移動文本 272
為OneWeb而設計 272
8.9viewportmeta標記 273
8.10CSS3媒體查詢 275
什麼是媒體查詢 275
使用link元素的媒體查詢例子 275
使用@media規則的媒體查詢示例 276
8.11練習媒體查詢 277
動手實作8.8 277
8.12靈活圖像 281
動手實作8.9 281
8.13測試移動顯示 283
用桌面瀏覽器測試 284
針對專業開發人員 285
複習和練習 287
複習題 287
動手練習 288
聚焦網頁設計 288
PacificTrailsResort案例分析 288
JavaJamCoffeeHouse案例分析 292
第9章表格基礎 297
9.1表格概述 298
table元素 298
border屬性 299
表格標題 299
9.2表行、單元格和表頭 300
動手實作9.1 301
9.3跨行和跨列 302
動手實作9.2 302
9.4配置無障礙訪問表格 304
9.5用CSS配置表格樣式 306
動手實作9.3 306
9.6CSS3結構性偽類 308
動手實作9.4 308
配置首字母 309
9.7配置表格區域 310
複習和練習 312
複習題 312
動手練習 313
聚焦網頁設計 313
PacificTrailsResort案例分析 314
JavaJamCoffeeHouse案例分析 315
第10章表單基礎 317
10.1概述 318
form元素 318
表單控制項 319
10.2文本框 320
10.3提交按鈕和重置按鈕 322
提交按鈕 322
重置按鈕 322
示例表單 322
動手實作10.1 323
10.4複選框和單選鈕 324
複選框 324
單選鈕 325
10.5隱藏欄位和密碼框 326
隱藏欄位 326
密碼框 326
10.6textarea元素 328
動手實作10.2 329
10.7select和option元素 330
select元素 330
option元素 330
10.8label元素 332
動手實作10.3 333
10.9fieldset元素和legend元素 334
fieldset元素 334
legend元素 334
用CSS配置fieldset分組樣式 335
10.10用CSS配置表單樣式 336
動手實作10.4 336
屬性選擇符 337
10.11伺服器端處理 338
隱私和表單 339
10.12表單練習 340
動手實作10.5 340
10.13HTML5文本表單控制項 342
E-mail地址輸入表單控制項 342
URL表單輸入控制項 342
電話號碼錶單輸入控制項 343
搜尋詞輸入表單控制項 343
HTML5文本框表單控制項的
有效屬性 343
10.14HTML5的datalist元素 344
10.15HTML5的slider控制項和spinner
控制項 346
slider表單輸入控制項 346
spinner表單輸入控制項 347
HTML5和漸進式增強 347
10.16HTML5日曆和顏色池控制項 348
日曆輸入表單控制項 348
顏色池表單控制項 349
10.17HTML5表單練習 350
動手實作10.6 350
複習和練習 352
複習題 352
動手練習 353
聚焦網頁設計 353
PacificTrailsResort案例分析 353
JavaJamCoffeeHouse案例分析 357
第11章媒體和互動性基礎 361
11.1外掛程式、容器和codec 362
輔助應用程式和外掛程式 362
11.2配置音頻和視頻 364
訪問音頻或視頻檔案 364
動手實作11.1 364
多媒體和瀏覽器兼容問題 365
11.3Flash和HTML5embed元素 366
embed元素 366
動手實作11.2 367
11.4HTML5audio和source元素 368
audio元素 368
source元素 368
動手實作11.3 369
11.5HTML5video和source元素 370
video元素 370
source元素 370
11.6練習HTML5視頻 372
動手實作11.4 372
11.7iframe元素 374
動手實作11.5 375
11.8CSS3的transform屬性 376
CSS3旋轉變換 376
CSS3伸縮變換 377
動手實作11.6 377
11.9CSS3transition屬性 378
動手實作11.7 378
11.10練習CSS過渡 380
動手實作11.8 380
11.11CSS下拉選單 382
動手實作11.9 382
11.12JavaScript和jQuery 384
JavaScript 384
jQuery 385
11.13HTML5API 386
地理位置 386
Web存儲 386
離線Web應用程式 386
用canvas元素繪圖 387
複習和練習 388
複習題 388
動手練習 388
聚焦網頁設計 389
PacificTrailsResort案例分析 389
JavaJamCoffeeHouse案例分析 391
第12章Web發布基礎 393
12.1註冊域名 394
選擇域名 394
註冊域名 395
12.2選擇Web主機 396
Web主機的類型 396
選擇虛擬主機 396
12.3用FTP發布 399
FTP應用程式 399
用FTP連線 399
使用FTP 399
12.4提交到搜尋引擎 401
搜尋引擎的組成 401
在搜尋引擎中列出你的網站 402
12.5搜尋引擎最佳化 403
連結 404
圖片和多媒體 404
有效代碼 404
有價值的內容 404
12.6無障礙訪問測試 405
通用設計和無障礙訪問 405
Web無障礙訪問標準 405
測試無障礙設計相容性 406
12.7可用性測試 407
進行可用性測試 407
動手實作12.1 408
複習和練習 409
複習題 409
動手練習 410
聚焦網頁設計 410
PacificTrailsResort案例分析 411
JavaJamCoffeeHouse案例分析 411
附錄A複習和練習答案 413
附錄BHTML5速查表 414
附錄CCSS速查表 418
附錄DXHTML速查表 422
附錄E對比XHTML和HTML5 425
附錄FWCAG2.0快速參考 433
附錄GWeb安全調色板 435