HTML5與CSS3從入門到精通(第3版) ( Basics of Web design: HTML5 and CSS3 )
內容描述
本書針對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
…………
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.10 HTML語法校驗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
block anchor 51
2.14練習使用鏈接52
站點地圖52
動手實作2.14 52
2.15電子郵件鏈接56
動手實作2.15 57
複習和練習58
複習題58
動手練習59
聚焦網頁設計59
案例分析59
Pacific Trails Resort案例分析60
JavaJam Coffee House案例分析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.1 CSS概述112
層疊樣式表的優點112
配置CSS的方法113
層疊樣式表的“層疊” 113
4.2 CSS選擇符和聲明114
CSS語法基礎114
background-color屬性114
color屬性114
配置背景色和文本色115
4.3 CSS顏色值語法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.7 CSS的class、ID和後代選擇符125
class選擇符125
id選擇符125
後代選擇符125
動手實作4.4 125
4.8 span元素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.12 CSS語法校驗136
動手實作4.8 136
複習和練習138
複習題138
動手練習139
聚焦網頁設計139
Pacific Trails Resort案例分析140
JavaJam Coffee House案例分析143
第5章圖形和文本 式基礎147
5.1圖片148
GIF圖片148
JPEG圖片148
PNG圖片149
新的WebP圖像格式149
5.2 img元素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.8 CSS文本屬性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
Pacific Trails Resort案例分析174
JavaJam Coffee House案例分析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.5 CSS3圓角192
動手實作6.3 193
6.6居中頁面內容194
動手實作6.4 194
6.7 CSS3的邊框和文本陰影196
CSS3的box-shadow屬性196
CSS3的text-shadow屬性196
動手實作6.5 197
6.8 CSS3的background-clip和
background-origin屬性198
CSS3 background-clip屬性198
CSS3 background-origin屬性199
6.9 CSS3背景大小和縮放200
6.10練習使用CSS3屬性202
動手實作6.6 202
6.11 CSS3的opacity屬性204
動手實作6.7 204
6.12 CSS3 RGBA顏色206
動手實作6.8 207
6.13 CSS3 HSLA顏色208
色 調、飽和度、亮度和alpha 208
HSLA顏色示例208
動手實作6.9 209
6.14 CSS3的漸變210
線性漸變語法210
輻射漸變語法210
CSS3漸變和漸進式增強211
動手實作6.10 211
複習和練習212
複習題212
動手練習213
聚焦網頁設計213
Pacific Trails Resort案例分析213
JavaJam Coffee House案例分析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
用CSS text-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
相對定位2 44
絕對定位245
7.11練習定位246
動手實作7.8 246
7.12 CSS精靈248
動手實作7.9 249
複習和練習250
複習題250
動手練習251
聚焦網頁設計251
Pacific Trails Resort案例分析251
JavaJam Coffee House案例分析252
第8章鏈接、佈局和移動
開發進階255
8.1相對鏈接的更多知識256
相對鏈接的例子256
動手實作8.1 256
8.2區段標識符258
動手實作8.2 259
8.3 figure元素和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.6 HTML5與舊瀏覽器的兼容性266
配置CSS塊顯示266
HTML5 Shim 266
動手實作8.6 267
8.7 CSS對打印的支持268
打印樣式最佳實踐268
動手實作8.7 269
8.8移動網頁設計270
移動網頁設計要考慮的問題270
為移動使用優化佈局271
優化移動導航271
優化移動圖片272
優化移動文本272
為One Web 設計272
8.9 viewport meta標記273
8.10 CSS3媒體查詢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
Pacific Trails Resort案例分析288
JavaJam Coffee House案例分析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.6 CSS3結構性偽類308
動手實作9.4 308
配置首字母309
9.7配置表格區域310
複習和練習312
複習題312
動手練習313
聚焦網頁設計313
Pacific Trails Resort案例分析314
JavaJam Coffee House案例分析315
第10章表單基礎317
- 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.6 textarea元素328
動手實作10.2 329
10.7 select和option元素330
select元素330
option元素330
10.8 label元素332
動手實作10.3 333
10.9 fieldset元素和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.13 HTML5文本表單控件342
E-mail地址輸入表單控件342
URL表單輸入控件342
電話號碼表單輸入控件343
搜索詞輸入表單控件343
HTML5文本框表單控件的
有效屬性343
10.14 HTML5的datalist元素344
10.15 HTML5的slider控件和spinner
控件346
slider表單輸入控件346
spinner 單輸入控件347
HTML5和漸進式增強347
10.16 HTML5日曆和顏色池控件348
日曆輸入表單控件348
顏色池表單控件349
10.17 HTML5表單練習350
動手實作10.6 350
複習和練習352
複習題352
動手練習353
聚焦網頁設計353
Pacific Trails Resort案例分析353
JavaJam Coffee House案例分析357
第11章媒體和交互性基礎361
11.1插件、容器和codec 362
輔助應用程序和插件362
11.2配置音頻和視頻364
訪問音頻或視頻文件364
動手實作11.1 364
多媒體和瀏覽器兼容問題365
11.3 Flash和HTML5 embed元素366
embed元素366
動手實作11.2 367
11.4 HTML5 audio和source元素368
audio元素368
source元素368
動手實作11.3 369
11.5 HTML5 video和source元素370
video元素370
source元素370
11.6練習HTML5視頻372
動手實作11.4 372
11.7 iframe元素374
動手實作11.5 375
11.8 CSS3的transform屬性376
CSS3旋轉變換376
CSS3伸縮變換377
動手實作11.6 377
11.9 CSS3 transition屬性378
動手實作11.7 378
11.10練習C SS過渡380
動手實作11.8 380
11.11 CSS下拉菜單382
動手實作11.9 382
11.12 JavaScript和jQuery 384
JavaScript 384
jQuery 385
11.13 HTML5 API 386
地理位置386
Web存儲386
離線Web應用程序386
用canvas元素繪圖387
複習和練習388
複習題388
動手練習388
聚焦網頁設計389
Pacific Trails Resort案例分析389
JavaJam Coffee House案例分析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
動手練習4 10
聚焦網頁設計410
Pacific Trails Resort案例分析411
JavaJam Coffee House案例分析411
附錄A複習和練習答案413
附錄B HTML5速查表414
附錄C CSS速查表418
附錄D XHTML速查表422
附錄E對比XHTML和HTML5 425
附錄F WCAG 2.0快速參考433
附錄G Web安全調色板435
作者介紹
作者:(美)特麗·菲爾克-莫里斯譯者:周靖
特麗·菲爾克-莫里斯,美國哈珀學院榮休教授。她熟悉各種平台和軟件開發語言,有二十多年的信息技術教學經驗,講授的課程有網頁開發、計算機信息系統、教學技術和數學,以及信息管理和數據庫研究生課程。
莫里斯博士富有創新精神,先後榮獲2002—2003年度Glenn A. Reich紀念獎(嘉獎她在教育技術方面做出的努力)和2006年度Blackboard Greenhouse遠程教學模範獎(嘉獎她在課堂教學中率先使用互聯網),還作為2008年度遠程教育優秀教師入選美國教育技術委員會。
莫里斯博士的《 HTML5網頁設計入門經典》已經出版發行到第8版,另一本以動手實作和案例學習著稱的入門經典《HTML5與CSS3網頁設計基礎》系列版本也備受廣大師生青睞。
她一直保持旺盛的學習力,擁有教育學博士學位、信息系統碩士學位和遠程教學碩士學位,以及很多從業資格證書:CIW電子商務設計師、CIW設計師、CIW認證講師,WOW網絡管理員和Adobe認證Dreamweaver 8開發人員。