內(nèi)容簡(jiǎn)介
本書針對(duì)HTML5和CSS3的最新標(biāo)準(zhǔn)進(jìn)行及時(shí)的更新和修訂，包含的主題有：Internet和Web概念；創(chuàng)建HTML5網(wǎng)頁；用CSS配置顏色和文本；用CSS配置頁面布局；配置圖像和多媒體；探索新增的CSS3特性；應(yīng)用網(wǎng)頁設(shè)計(jì)最佳實(shí)踐；設(shè)計(jì)可訪問和可用的網(wǎng)頁；搜索引擎優(yōu)化設(shè)計(jì)；選擇域名；發(fā)布網(wǎng)站。
本書適合所有對(duì)網(wǎng)頁設(shè)計(jì)感興趣的讀者閱讀，是一本理想的入門參考。
前 言
《HTML5與CSS3從入門到精通》適用于網(wǎng)頁設(shè)計(jì)或開發(fā)初級(jí)課程。每個(gè)主題都只用兩頁篇幅進(jìn)行講解，在指出關(guān)鍵點(diǎn)的同時(shí)，一般還包含動(dòng)手實(shí)作。全書覆蓋網(wǎng)頁設(shè)計(jì)師需要掌握的所有基礎(chǔ)知識(shí)，包括以下主題：
互聯(lián)網(wǎng)和萬維網(wǎng)的概念
用HTML5創(chuàng)建網(wǎng)頁
用層疊樣式表(CSS)配置文本、顏色和網(wǎng)頁布局
對(duì)網(wǎng)頁上的圖片和多媒體進(jìn)行配置
探索新的CSS3屬性
網(wǎng)頁設(shè)計(jì)最佳實(shí)踐
對(duì)無障礙訪問、可用性和搜索引擎優(yōu)化的考量
取得域名和主機(jī)
發(fā)布到網(wǎng)上
本書中文版的學(xué)生文件可以從配套網(wǎng)站http://pan.baidu.com/s/1yd43W下載，其中包括動(dòng)手實(shí)作的原始文件和解決方案，以及案例分析的原始文件。
在本書第2版取得極大成功之后，第3版新增了以下特性：
更豐富的動(dòng)手實(shí)作
全面更新了范例代碼、案例分析和網(wǎng)絡(luò)資源
根據(jù)HTML5元素和HTML5 API進(jìn)行了更新
對(duì)響應(yīng)性網(wǎng)頁設(shè)計(jì)技術(shù)和CSS媒體查詢進(jìn)行了更全面的介紹
更新了HTML5和CSS參考資源
本書特色
立足當(dāng)下，展望未來。本書采用獨(dú)特的教學(xué)方式，使學(xué)生在學(xué)習(xí)適合當(dāng)下的網(wǎng)頁設(shè)計(jì)技能的同時(shí)，掌握新的HTML5編碼技術(shù)，迎接未來的挑戰(zhàn)。
精心挑選主題。本書既傳授“硬”技能，比如HTML5和層疊樣式表(第1章和第2章，第4章~第11章)，也傳授“軟”技能，比如網(wǎng)頁設(shè)計(jì)(第3章)和發(fā)布到網(wǎng)上(第12章)。打下良好基礎(chǔ)之后，學(xué)生作為網(wǎng)頁設(shè)計(jì)師追尋自己的職業(yè)夢(mèng)想時(shí)，會(huì)更加得心應(yīng)手。使用本書的學(xué)生和老師會(huì)發(fā)現(xiàn)，我們這個(gè)課程變得更有趣了。學(xué)生在創(chuàng)建網(wǎng)頁和網(wǎng)站時(shí)，可以一起討論、綜合和運(yùn)用軟硬技能。每個(gè)主題都用兩頁的篇幅來講解，除了快速提供需要掌握的知識(shí)點(diǎn)，還通過動(dòng)手實(shí)作來立即鞏固所學(xué)到的知識(shí)。
每個(gè)主題兩頁篇幅。每個(gè)主題都用簡(jiǎn)潔的、兩頁篇幅的一個(gè)小節(jié)進(jìn)行講述。許多小節(jié)還包含馬上就可以開始的動(dòng)手實(shí)作，旨在幫助鞏固新學(xué)的技能或概念。這種精心設(shè)計(jì)對(duì)學(xué)業(yè)沉重的學(xué)生尤其有用，因?yàn)樗麄冃枰⒓锤闱宄P(guān)鍵的概念。
動(dòng)手實(shí)作。網(wǎng)頁開發(fā)是一門技能，只有通過動(dòng)手實(shí)作才能更好地掌握。本書十分強(qiáng)調(diào)實(shí)際動(dòng)手能力的培養(yǎng)，體現(xiàn)在每章的動(dòng)手實(shí)作練習(xí)題、章末練習(xí)題以及通過真實(shí)的案例分析來完成網(wǎng)站的開發(fā)。
網(wǎng)站案例分析。從第2章開始，案例分析將貫穿全書。它的作用是鞏固每章所學(xué)的技能。教師資源中心提供了案例的示例解決方案，網(wǎng)址是http://www.pearsonhighered.com/irc。
聚焦網(wǎng)頁設(shè)計(jì)。大多數(shù)章都提供額外的活動(dòng)來探索與本章有關(guān)的網(wǎng)頁設(shè)計(jì)主題。這些活動(dòng)可以用于鞏固、擴(kuò)展和增強(qiáng)課程主題。
在我的網(wǎng)頁開發(fā)課堂中，學(xué)生經(jīng)常會(huì)問到一些同樣的問題。書中列出了這些問題，并用FAQ標(biāo)志注明。
開發(fā)無障礙網(wǎng)頁的重要性日益增強(qiáng)，所以無障礙網(wǎng)頁設(shè)計(jì)技術(shù)將貫穿全書。這個(gè)特殊標(biāo)記可以讓您更方便地找到這些信息。
本書使用特殊的道德規(guī)范標(biāo)記注明與網(wǎng)頁開發(fā)有關(guān)的道德規(guī)范話題。
提供有用的背景資料，或者幫助提高生產(chǎn)力。
這個(gè)特殊標(biāo)記代表可供深入探索的網(wǎng)絡(luò)資源，方便學(xué)生對(duì)當(dāng)前主題進(jìn)行深入學(xué)習(xí)。
參考資料。附錄提供了豐富的參考資料，包括XHTML參考、HTML5參考、CSS參考、WCAG 2.0快速參考以及對(duì)ARIA Landmark Roles的概述。
視頻講解(Video Note)旨在講解關(guān)鍵編程概念和技術(shù)，演示從設(shè)計(jì)到編碼來解決問題的過程。視頻講解使學(xué)生可以方便地自學(xué)自己感興趣的主題，支持選擇、播放、倒退、快進(jìn)和暫停。每當(dāng)看到 視頻講解：……，都表明當(dāng)前主題有對(duì)應(yīng)的視頻講解。視頻列表可以從本書中文版配套網(wǎng)站獲取，網(wǎng)址是http://pan.baidu.com/s/1yd43W。注意，由于是英文視頻，所以為了方便索引，書中保留了這些視頻的英文名稱。
目 錄
第1章 互聯(lián)網(wǎng)和萬維網(wǎng)基礎(chǔ) 1
1.1 互聯(lián)網(wǎng)和萬維網(wǎng) 2
互聯(lián)網(wǎng) 2
互聯(lián)網(wǎng)的誕生 2
互聯(lián)網(wǎng)的發(fā)展 2
萬維網(wǎng)的誕生 2
第一個(gè)圖形化瀏覽器 3
各種技術(shù)的聚合 3
1.2 網(wǎng)頁標(biāo)準(zhǔn)和無障礙訪問 4
W3C推薦標(biāo)準(zhǔn) 4
網(wǎng)頁標(biāo)準(zhǔn)和無障礙訪問 4
無障礙訪問和法律 4
網(wǎng)頁通用設(shè)計(jì) 5
1.3 瀏覽器和服務(wù)器 6
網(wǎng)絡(luò)概述 6
客戶端/服務(wù)器模型 6
1.4 Internet協(xié)議 8
電子郵件協(xié)議 8
超文本傳輸協(xié)議 8
文件傳輸協(xié)議 8
傳輸控制協(xié)議/Internet協(xié)議 8
IP地址 9
1.5 統(tǒng)一資源標(biāo)識(shí)符(URI)和域名 10
URI和URL 10
域名 10
頂級(jí)域名 11
通用頂級(jí)域名 11
國(guó)家代碼頂級(jí)域名 12
域名系統(tǒng)DNS 13
1.6 網(wǎng)上的信息 14
網(wǎng)上的信息可靠嗎？ 14
網(wǎng)上的信息是最新的嗎？ 15
有沒有指向其他資源的外部鏈接？ 15
1.7 HTML概述 16
什么是HTML？ 16
什么是XML？ 17
什么是XHTML？ 17
HTML的最新版本HTML5 17
1.8 網(wǎng)頁幕后揭秘 18
文檔類型定義(DTD) 18
網(wǎng)頁模板 18
html元素 18
頁頭區(qū)域 19
主體區(qū)域 19
1.9 第一個(gè)網(wǎng)頁 20
動(dòng)手實(shí)作1.1 20
新建文件夾 20
保存文件 21
測(cè)試網(wǎng)頁 22
復(fù)習(xí)和練習(xí) 23
復(fù)習(xí)題 23
動(dòng)手練習(xí) 23
網(wǎng)上調(diào)研 24
聚焦網(wǎng)頁設(shè)計(jì) 24
第2章 HTML基礎(chǔ) 25
2.1 標(biāo)題元素 26
動(dòng)手實(shí)作2.1 26
無障礙訪問和標(biāo)題 27
HTML5更多的標(biāo)題選項(xiàng) 27
2.2 段落元素 28
動(dòng)手實(shí)作2.2 28
對(duì)齊 29
2.3 換行和水平標(biāo)尺 30
換行元素 30
動(dòng)手實(shí)作2.3 30
水平標(biāo)尺元素 31
動(dòng)手實(shí)作2.4 31
2.4 塊引用元素 32
動(dòng)手實(shí)作2.5 33
2.5 短語元素 34
2.6 有序列表 36
type屬性，start屬性和
reversed屬性 36
動(dòng)手實(shí)作2.6 37
2.7 無序列表 38
動(dòng)手實(shí)作2.7 39
2.8 描述列表 40
動(dòng)手實(shí)作2.8 41
2.9 特殊字符 42
動(dòng)手實(shí)作2.9 42
2.10 HTML語法校驗(yàn) 44
動(dòng)手實(shí)作2.10 44
2.11 結(jié)構(gòu)元素 46
div元素 46
header元素 46
nav元素 46
main元素 46
footer元素 46
動(dòng)手實(shí)作2.11 47
2.12 練習(xí)使用結(jié)構(gòu)元素 48
動(dòng)手實(shí)作2.12 48
2.13 錨元素 50
動(dòng)手實(shí)作2.13 50
鏈接目標(biāo) 51
絕對(duì)鏈接 51
相對(duì)鏈接 51
block anchor 51
2.14 練習(xí)使用鏈接 52
站點(diǎn)地圖 52
動(dòng)手實(shí)作2.14 52
2.15 電子郵件鏈接 56
動(dòng)手實(shí)作2.15 57
復(fù)習(xí)和練習(xí) 58
復(fù)習(xí)題 58
動(dòng)手練習(xí) 59
聚焦網(wǎng)頁設(shè)計(jì) 59
案例分析 59
Pacific Trails Resort案例分析 60
JavaJam Coffee House案例分析 62
第3章 網(wǎng)頁設(shè)計(jì)基礎(chǔ) 67
3.1 為目標(biāo)受眾設(shè)計(jì) 68
瀏覽器 69
屏幕分辨率 69
3.2 網(wǎng) 站 組 織 70
分級(jí)式組織 70
線性組織 71
隨機(jī)組織 71
3.3 視覺設(shè)計(jì)原則 72
重復(fù)：在整個(gè)設(shè)計(jì)中重復(fù)視覺元素 72
對(duì)比：添加視覺刺激和吸引注意力 73
近似：分組相關(guān)項(xiàng)目 73
對(duì)齊：對(duì)齊元素實(shí)現(xiàn)視覺上的統(tǒng)一 73
3.4 提供無障礙訪問 74
通用設(shè)計(jì)和增強(qiáng)無障礙訪問的
受益者 74
無障礙設(shè)計(jì)有助于提高在搜索
引擎中的排名 74
法律規(guī)定 75
無障礙設(shè)計(jì)的熱潮 75
3.5 文本的使用 76
文本設(shè)計(jì)的注意事項(xiàng) 76
3.6 調(diào)色板 78
十六進(jìn)制顏色值 78
網(wǎng)頁安全色 78
無障礙設(shè)計(jì)和顏色 79
3.7 針對(duì)目標(biāo)受眾進(jìn)行設(shè)計(jì) 80
面向兒童 80
面向年輕人 80
面向所有人 81
面向老年人 81
3.8 選擇顏色方案 83
以一張圖片為基礎(chǔ)的方案 83
色輪 84
變深、變淺和變灰 84
單色 85
相似色 85
互補(bǔ)色 86
分散互補(bǔ)色 86
三色 86
四色 87
實(shí)現(xiàn)顏色方案 87
3.9 使用圖片和多媒體 88
文件大小和圖片尺寸 88
抗鋸齒/鋸齒化文本的問題 88
只使用必要的多媒體 89
提供替代文本 89
3.10 更多設(shè)計(jì)考慮 90
感覺到的加載時(shí)間 91
第一屏 91
適當(dāng)留白 91
水平滾動(dòng) 91
3.11 導(dǎo)航設(shè)計(jì) 92
網(wǎng)站要易于導(dǎo)航 92
導(dǎo)航欄 92
圖片導(dǎo)航 93
動(dòng)態(tài)導(dǎo)航 93
站點(diǎn)地圖 93
站點(diǎn)搜索功能 94
3.12 線框和頁面布局 95
3.13 固定和流動(dòng)布局 98
固定布局 98
流動(dòng)布局 99
3.14 為移動(dòng)網(wǎng)絡(luò)設(shè)計(jì) 100
三種方式 100
移動(dòng)設(shè)備設(shè)計(jì)考慮 100
桌面和移動(dòng)網(wǎng)站的例子 101
移動(dòng)設(shè)計(jì)小結(jié) 101
3.15 靈活響應(yīng)的網(wǎng)頁設(shè)計(jì) 102
3.16 網(wǎng)頁設(shè)計(jì)最佳實(shí)踐 104
復(fù)習(xí)和練習(xí) 106
復(fù)習(xí)題 106
動(dòng)手練習(xí) 107
聚焦網(wǎng)頁設(shè)計(jì) 107
網(wǎng)頁項(xiàng)目案例分析 108
項(xiàng)目里程碑 108
第4章 CSS基礎(chǔ) 111
4.1 CSS概述 112
層疊樣式表的優(yōu)點(diǎn) 112
配置CSS的方法 113
層疊樣式表的“層疊” 113
4.2 CSS選擇符和聲明 114
CSS語法基礎(chǔ) 114
background-color屬性 114
color屬性 114
配置背景色和文本色 115
4.3 CSS顏色值語法 116
4.4 配置內(nèi)聯(lián)CSS 118
style屬性 118
動(dòng)手實(shí)作4.1 118
4.5 配置嵌入CSS 120
style元素 120
動(dòng)手實(shí)作4.2 121
4.6 配置外部CSS 123
link元素 123
動(dòng)手實(shí)作4.3 123
4.7 CSS的class、ID和后代選擇符 125
class選擇符 125
id選擇符 125
后代選擇符 125
動(dòng)手實(shí)作4.4 125
4.8 span元素 127
span元素 127
動(dòng)手實(shí)作4.5 127
4.9 練習(xí)使用CSS 129
動(dòng)手實(shí)作4.6 129
將嵌入CSS轉(zhuǎn)換為外部CSS 129
將網(wǎng)頁與外部CSS文件關(guān)聯(lián) 129
4.10 層疊 132
4.11 練習(xí)使用層疊 134
動(dòng)手實(shí)作4.7 134
4.12 CSS語法校驗(yàn) 136
動(dòng)手實(shí)作4.8 136
復(fù)習(xí)和練習(xí) 138
復(fù)習(xí)題 138
動(dòng)手練習(xí) 139
聚焦網(wǎng)頁設(shè)計(jì) 139
Pacific Trails Resort案例分析 140
JavaJam Coffee House案例分析 143
第5章 圖形和文本樣式基礎(chǔ) 147
5.1 圖片 148
GIF圖片 148
JPEG圖片 148
PNG圖片 149
新的WebP圖像格式 149
5.2 img元素 150
動(dòng)手實(shí)作5.1 150
5.3 圖片鏈接 152
動(dòng)手實(shí)作5.2 152
5.4 配置背景圖片 154
background-image屬性 154
同時(shí)使用背景顏色和背景圖片 154
瀏覽器如何顯示背景圖片 154
background-attachment屬性 155
5.5 定位背景圖片 156
background-repeat屬性 156
定位背景圖片 156
動(dòng)手實(shí)作5.3 157
5.6 用CSS3配置多張背景圖片 158
漸進(jìn)式增強(qiáng) 158
動(dòng)手實(shí)作5.4 159
5.7 用CSS配置字體 160
font-family屬性 160
動(dòng)手實(shí)作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 練習(xí)配置圖形和文本 164
動(dòng)手實(shí)作5.6 164
5.10 用CSS配置列表符號(hào) 166
用圖片代替列表符號(hào) 167
動(dòng)手實(shí)作5.7 167
5.11 收藏圖標(biāo) 168
配置收藏圖標(biāo) 168
動(dòng)手實(shí)作5.8 168
5.12 圖像映射 170
map元素 170
area元素 170
探索矩形圖像映射 170
5.13 復(fù)習(xí)和練習(xí) 172
復(fù)習(xí)題 172
動(dòng)手練習(xí) 173
聚焦網(wǎng)頁設(shè)計(jì) 174
Pacific Trails Resort案例分析 174
JavaJam Coffee House案例分析 178
第6章 CSS進(jìn)階 183
6.1 寬度和高度 184
width屬性 184
min-width屬性 184
max-width屬性 184
height屬性 185
動(dòng)手實(shí)作6.1 185
6.2 框模型 186
內(nèi)容 186
填充 186
邊框 186
邊距 187
框模型實(shí)例 187
6.3 邊距和填充 188
margin屬性 188
padding屬性 188
6.4 邊框 190
動(dòng)手實(shí)作6.2 191
6.5 CSS3圓角 192
動(dòng)手實(shí)作6.3 193
6.6 居中頁面內(nèi)容 194
動(dòng)手實(shí)作6.4 194
6.7 CSS3的邊框和文本陰影 196
CSS3的box-shadow屬性 196
CSS3的text-shadow屬性 196
動(dòng)手實(shí)作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 練習(xí)使用CSS3屬性 202
動(dòng)手實(shí)作6.6 202
6.11 CSS3的opacity屬性 204
動(dòng)手實(shí)作6.7 204
6.12 CSS3 RGBA顏色 206
動(dòng)手實(shí)作6.8 207
6.13 CSS3 HSLA顏色 208
色調(diào)、飽和度、亮度和alpha 208
HSLA顏色示例 208
動(dòng)手實(shí)作6.9 209
6.14 CSS3的漸變 210
線性漸變語法 210
輻射漸變語法 210
CSS3漸變和漸進(jìn)式增強(qiáng) 211
動(dòng)手實(shí)作6.10 211
復(fù)習(xí)和練習(xí) 212
復(fù)習(xí)題 212
動(dòng)手練習(xí) 213
聚焦網(wǎng)頁設(shè)計(jì) 213
Pacific Trails Resort案例分析 213
JavaJam Coffee House案例分析 216
第7章 頁面布局基礎(chǔ) 221
7.1 正常流動(dòng) 222
動(dòng)手實(shí)作7.1 222
7.2 浮動(dòng) 224
float屬性 224
動(dòng)手實(shí)作7.2 225
浮動(dòng)元素和正常流動(dòng) 225
7.3 清除浮動(dòng) 226
clear屬性 226
7.4 溢出 228
overflow屬性 228
7.5 基本雙欄布局 230
動(dòng)手實(shí)作7.3 230
雙欄布局的例子 234
7.6 用無序列表實(shí)現(xiàn)垂直導(dǎo)航 236
用CSS配置無序列表 236
用CSS text-decoration屬性消除
下劃線 236
動(dòng)手實(shí)作7.4 237
7.7 用無序列表實(shí)現(xiàn)水平導(dǎo)航 238
CSS的display屬性 238
動(dòng)手實(shí)作7.5 239
7.8 用偽類實(shí)現(xiàn)CSS交互性 240
動(dòng)手實(shí)作7.6 240
7.9 練習(xí)CSS雙欄布局 242
動(dòng)手實(shí)作7.7 242
7.10 用CSS進(jìn)行定位 244
static定位 244
fixed定位 244
相對(duì)定位 244
絕對(duì)定位 245
7.11 練 習(xí) 定 位 246
動(dòng)手實(shí)作7.8 246
7.12 CSS精靈 248
動(dòng)手實(shí)作7.9 249
復(fù)習(xí)和練習(xí) 250
復(fù)習(xí)題 250
動(dòng)手練習(xí) 251
聚焦網(wǎng)頁設(shè)計(jì) 251
Pacific Trails Resort案例分析 251
JavaJam Coffee House案例分析 252
第8章 鏈接、布局和移動(dòng)
開發(fā)進(jìn)階 255
8.1 相對(duì)鏈接的更多知識(shí) 256
相對(duì)鏈接的例子 256
動(dòng)手實(shí)作8.1 256
8.2 區(qū)段標(biāo)識(shí)符 258
動(dòng)手實(shí)作8.2 259
8.3 figure元素和figcaption元素 260
figure元素 260
figcaption元素 260
添加圖題 260
動(dòng)手實(shí)作8.3 261
8.4 圖片浮動(dòng)練習(xí) 262
動(dòng)手實(shí)作8.4 262
8.5 更多HTML5元素 264
section元素 264
article元素 264
aside元素 264
time元素 264
動(dòng)手實(shí)作8.5 264
8.6 HTML5與舊瀏覽器的兼容性 266
配置CSS塊顯示 266
HTML5 Shim 266
動(dòng)手實(shí)作8.6 267
8.7 CSS對(duì)打印的支持 268
打印樣式最佳實(shí)踐 268
動(dòng)手實(shí)作8.7 269
8.8 移動(dòng)網(wǎng)頁設(shè)計(jì) 270
移動(dòng)網(wǎng)頁設(shè)計(jì)要考慮的問題 270
為移動(dòng)使用優(yōu)化布局 271
優(yōu)化移動(dòng)導(dǎo)航 271
優(yōu)化移動(dòng)圖片 272
優(yōu)化移動(dòng)文本 272
為One Web而設(shè)計(jì) 272
8.9 viewport meta標(biāo)記 273
8.10 CSS3媒體查詢 275
什么是媒體查詢 275
使用link元素的媒體查詢例子 275
使用@media規(guī)則的媒體查詢示例 276
8.11 練習(xí)媒體查詢 277
動(dòng)手實(shí)作8.8 277
8.12 靈活圖像 281
動(dòng)手實(shí)作8.9 281
8.13 測(cè)試移動(dòng)顯示 283
用桌面瀏覽器測(cè)試 284
針對(duì)專業(yè)開發(fā)人員 285
復(fù)習(xí)和練習(xí) 287
復(fù)習(xí)題 287
動(dòng)手練習(xí) 288
聚焦網(wǎng)頁設(shè)計(jì) 288
Pacific Trails Resort案例分析 288
JavaJam Coffee House案例分析 292
第9章 表格基礎(chǔ) 297
9.1 表格概述 298
table元素 298
border屬性 299
表格標(biāo)題 299
9.2 表行、單元格和表頭 300
動(dòng)手實(shí)作9.1 301
9.3 跨行和跨列 302
動(dòng)手實(shí)作9.2 302
9.4 配置無障礙訪問表格 304
9.5 用CSS配置表格樣式 306
動(dòng)手實(shí)作9.3 306
9.6 CSS3結(jié)構(gòu)性偽類 308
動(dòng)手實(shí)作9.4 308
配置首字母 309
9.7 配置表格區(qū)域 310
復(fù)習(xí)和練習(xí) 312
復(fù)習(xí)題 312
動(dòng)手練習(xí) 313
聚焦網(wǎng)頁設(shè)計(jì) 313
Pacific Trails Resort案例分析 314
JavaJam Coffee House案例分析 315
第10章 表單基礎(chǔ) 317
10.1 概述 318
form元素 318
表單控件 319
10.2 文本框 320
10.3 提交按鈕和重置按鈕 322
提交按鈕 322
重置按鈕 322
示例表單 322
動(dòng)手實(shí)作10.1 323
10.4 復(fù)選框和單選鈕 324
復(fù)選框 324
單選鈕 325
10.5 隱藏字段和密碼框 326
隱藏字段 326
密碼框 326
10.6 textarea元素 328
動(dòng)手實(shí)作10.2 329
10.7 select和option元素 330
select元素 330
option元素 330
10.8 label元素 332
動(dòng)手實(shí)作10.3 333
10.9 fieldset元素和legend元素 334
fieldset元素 334
legend元素 334
用CSS配置fieldset分組樣式 335
10.10 用CSS配置表單樣式 336
動(dòng)手實(shí)作10.4 336
屬性選擇符 337
10.11 服務(wù)器端處理 338
隱私和表單 339
10.12 表單練習(xí) 340
動(dòng)手實(shí)作10.5 340
10.13 HTML5文本表單控件 342
E-mail地址輸入表單控件 342
URL表單輸入控件 342
電話號(hào)碼表單輸入控件 343
搜索詞輸入表單控件 343
HTML5文本框表單控件的
有效屬性 343
10.14 HTML5的datalist元素 344
10.15 HTML5的slider控件和spinner
控件 346
slider表單輸入控件 346
spinner表單輸入控件 347
HTML5和漸進(jìn)式增強(qiáng) 347
10.16 HTML5日歷和顏色池控件 348
日歷輸入表單控件 348
顏色池表單控件 349
10.17 HTML5表單練習(xí) 350
動(dòng)手實(shí)作10.6 350
復(fù)習(xí)和練習(xí) 352
復(fù)習(xí)題 352
動(dòng)手練習(xí) 353
聚焦網(wǎng)頁設(shè)計(jì) 353
Pacific Trails Resort案例分析 353
JavaJam Coffee House案例分析 357
第11章 媒體和交互性基礎(chǔ) 361
11.1 插件、容器和codec 362
輔助應(yīng)用程序和插件 362
11.2 配置音頻和視頻 364
訪問音頻或視頻文件 364
動(dòng)手實(shí)作11.1 364
多媒體和瀏覽器兼容問題 365
11.3 Flash和HTML5 embed元素 366
embed元素 366
動(dòng)手實(shí)作11.2 367
11.4 HTML5 audio和source元素 368
audio元素 368
source元素 368
動(dòng)手實(shí)作11.3 369
11.5 HTML5 video和source元素 370
video元素 370
source元素 370
11.6 練習(xí)HTML5視頻 372
動(dòng)手實(shí)作11.4 372
11.7 iframe元素 374
動(dòng)手實(shí)作11.5 375
11.8 CSS3的transform屬性 376
CSS3旋轉(zhuǎn)變換 376
CSS3伸縮變換 377
動(dòng)手實(shí)作11.6 377
11.9 CSS3 transition屬性 378
動(dòng)手實(shí)作11.7 378
11.10 練習(xí)CSS過渡 380
動(dòng)手實(shí)作11.8 380
11.11 CSS下拉菜單 382
動(dòng)手實(shí)作11.9 382
11.12 JavaScript和jQuery 384
JavaScript 384
jQuery 385
11.13 HTML5 API 386
地理位置 386
Web存儲(chǔ) 386
離線Web應(yīng)用程序 386
用canvas元素繪圖 387
復(fù)習(xí)和練習(xí) 388
復(fù)習(xí)題 388
動(dòng)手練習(xí) 388
聚焦網(wǎng)頁設(shè)計(jì) 389
Pacific Trails Resort案例分析 389
JavaJam Coffee House案例分析 391
第12章 Web發(fā)布基礎(chǔ) 393
12.1 注冊(cè)域名 394
選擇域名 394
注冊(cè)域名 395
12.2 選擇Web主機(jī) 396
Web主機(jī)的類型 396
選擇虛擬主機(jī) 396
12.3 用FTP發(fā)布 399
FTP應(yīng)用程序 399
用FTP連接 399
使用FTP 399
12.4 提交到搜索引擎 401
搜索引擎的組成 401
在搜索引擎中列出你的網(wǎng)站 402
12.5 搜索引擎優(yōu)化 403
鏈接 404
圖片和多媒體 404
有效代碼 404
有價(jià)值的內(nèi)容 404
12.6 無障礙訪問測(cè)試 405
通用設(shè)計(jì)和無障礙訪問 405
Web無障礙訪問標(biāo)準(zhǔn) 405
測(cè)試無障礙設(shè)計(jì)相容性 406
12.7 可用性測(cè)試 407
進(jìn)行可用性測(cè)試 407
動(dòng)手實(shí)作12.1 408
復(fù)習(xí)和練習(xí) 409
復(fù)習(xí)題 409
動(dòng)手練習(xí) 410
聚焦網(wǎng)頁設(shè)計(jì) 410
Pacific Trails Resort案例分析 411
JavaJam Coffee House案例分析 411
附錄A 復(fù)習(xí)和練習(xí)答案 413
附錄B HTML5速查表 414
附錄C CSS速查表 418
附錄D XHTML速查表 422
附錄E 對(duì)比XHTML和HTML5 425
附錄F WCAG 2.0快速參考 433
附錄G Web安全調(diào)色板 435
補(bǔ)充材料
學(xué)生資源。本書中文版讀者請(qǐng)?jiān)L問http://pan.baidu.com/s/1yd43W獲取動(dòng)手實(shí)作的原始文件和解決方案以及案例分析的原始文件。
教師資源。以下補(bǔ)充資源只供符合條件的教師使用，請(qǐng)發(fā)送郵件到coo@netease.com了解更多信息。
章末練習(xí)題答案
案例分析作業(yè)答案
試題
PPT演示文稿
示范教學(xué)大綱
作者網(wǎng)站。除了出版社為本書提供的配套網(wǎng)站，作者另外建了一個(gè)網(wǎng)站，網(wǎng)址為http://www.webdevbasics.net。該網(wǎng)站擁有許多額外的資源，包括調(diào)色板、Flash學(xué)習(xí)/復(fù)習(xí)游戲、Adobe Flash教程、Adobe Fireworks教程和Adobe Photoshop教程。還為每一章都單獨(dú)建一個(gè)網(wǎng)頁，提供這一章的示例、鏈接和更新信息。該網(wǎng)站由作者個(gè)人維護(hù)，不是出版商贊助的。
致 謝
特別感謝Addison-Wesley的同仁，包括Matt Goldstein，Kelsey Loanes，Carole Snyder和Camille Trentacoste。
感謝我的家人，尤其是我的“另一半”，感謝他的耐心、關(guān)愛、支持和鼓勵(lì)。最后還要特別紀(jì)念我的父親，我們永遠(yuǎn)想念他。
