●第 一部分  HTML5實戰 第 1章  HTML5簡介 3 1.1  HTML、XHTML和HTML5 3 1.1.1  HTML和XHTML 3 1.1.2  HTML5 4 1.2  學前準備 7 1.3  本章練習 8 第 2章  素 9 2.1  素 9 2.1.1  hea素 9 2.1.2  素 12 2.1.3  arti素 13 2.1.4  as素 14 2.1.5  sect素 14 2.1.6  foo素 14 2.2  素 15 2.2.1  新增in素類型 15 2.2.2  新增其素 26 2.3  其素 29 2.3.1  addr素 29 2.3.2  t素 31 2.3.3  progr素 32 2.3.4  me素 34 2.3.5  figure和figcapt素 34 2.3.6  fieldset和leg素 35 2.4  改素 36 2.4.1 &nbs素 36 2.4.2  素 37 2.4.3  sm素 38 2.4.4  scr素 39 2.5  本章練習 40 第3章  新增屬性 42 3.1  公共屬性 42 3.1.1  hidden屬性 42 3.1.2  draggable屬性 43 3.1.3  contenteditable屬性 44 3.1.4  data-*屬性 45 3.2  in素的新增屬性 47 3.2.1  autocomplete屬性 47 3.2.2  autofocus屬性 48 3.2.3  placeholder屬性 49 3.2.4  required屬性 50 3.2.5  pattern屬性 51 3.3  f素的新增屬性 52 3.4  本章練習 54 第4章 &nb素拖放 56 4.1 &nb素拖放簡介 56 4.2  dataTransfer對像 58 4.2.1  dataTransfer對像簡介 58 4.2.2  dataTransfer對像應用 59 4.3  本章練習 62 第5章  文件操作 63 5.1  文件操作簡介 63 5.2  File對像 68 5.3  FileReader對像 70 5.4  Blob對像 77 5.5  本章練習 81 第6章  本地存儲 83 6.1  本地存儲簡介 83 6.2  localStorage 84 6.3  sessionStorage 88 6.4  indexedDB 90 6.4.1  操作“數據庫” 91 6.4.2  操作“對像倉庫” 94 6.4.3  增刪查改 97 6.5  實戰題：計數器 107 6.6  本章練習 108 第7章  音頻視頻 109 7.1  視頻音頻簡介 109 7.1.1  Flash時代的逝去 109 7.1.2  HTML5時代的來臨 110 7.2  開發視頻 110 7.2.1  vi素 110 7.2.2  視頻格式 112 7.2.3  自定義視頻 113 7.3  開發音頻 122 7.3.1  au素 122 7.3.2  音頻格式 123 7.3.3  自定義音頻 124 7.4  本章練習 125 第8章  離線應用 126 8.1  搭建服務器環境 126 8.2  離線存儲 128 8.3  更新緩存 131 8.4  本章練習 132 第9章  多線程處理 133 9.1  Web Worker簡介 133 9.2  Web Worker應用 135 9.3  實戰題：後臺計算 137 9.4  本章練習 138 第 10章  地理位置 139 10.1  地理位置簡介 139 10.1.1  getCurrentPosition()方法 139 10.1.2  watchPosition()方法 143 10.1.3  clearWatch()方法 145 10.2  百度地圖 147 10.2.1  API簡介 147 10.2.2  API應用 151 10.3  本章練習 152 第 11章  桌面通知 153 11.1  Notification API簡介 153 11.2  Notification API應用 155 11.3  本章練習 157 第 12章  Canvas 158 12.1  Canvas是什麼 158 12.1.1  Canvas簡介 158 12.1.2  Canvas與SVG 160 12.2  Can素 160 12.2.1  Can素 161 12.2.2  Canvas對像 162 12.3  直線 164 12.3.1  Canvas坐標繫 164 12.3.2  直線的繪制 165 12.4  矩形 170 12.4.1  描邊矩形 170 12.4.2  填充矩形 173 12.4.3  rect()方法 176 12.4.4  清空矩形 178 12.5  多邊形 180 12.5.1  Canvas繪制箭頭 181 12.5.2  Canvas繪制正多邊形 182 12.5.3  Canvas繪制五角星 184 12.6  實戰題：繪制調色板 186 12.7  本章練習 188 第二部分  CSS3實戰 第 13章  CSS3簡介 191 13.1  CSS3簡介 191 13.2  瀏覽器私有前綴 192 13.3  一個酷炫的CSS3效果 194 13.4  本章練習 197 第 14章  新增選擇器 198 14.1  CSS3選擇器簡介 198 14.2  屬性選擇器 199 14.3 &nbs素偽類選擇器 201 14.3.1   :first-child、:last-child、:nth-child(n)、:only-child 201 14.3.2   :first-of-type、:last-of-type、:nth-of-type(n)、:only-of-type 204 14.4  UI偽類選擇器 205 14.4.1  :focus 205 14.4.2  ::selection 206 14.4.3  :checked 209 14.4.4  :enabled和:disabled 210 14.4.5  :read-write和:read-only 211 14.5  其他偽類選擇器 212 14.5.1  :root 212 14.5.2  :empty 213 14.5.3  :target 214 14.5.4  :not() 217 14.6  本章練習 218 第 15章  文本樣式 220 15.1  文本樣式簡介 220 15.2  文本陰影：text-shadow 220 15.2.1  W3C坐標繫 220 15.2.2  text-shadow屬性簡介 221 15.2.3  定義多個陰影 224 15.3  文本描邊：text-stroke 224 15.4  文本溢出：text-overflow 226 15.5  強制換行：word-wrap、 word-break 228 15.6  嵌入字體：@font-face 230 15.7  實戰題：火焰字 232 15.8  本章練習 233 第 16章  顏色樣式 234 16.1  顏色樣式簡介 234 16.2  opacity透明度 234 16.3  RGBA顏色 235 16.4  CSS3漸變 239 16.4.1  線性漸變 240 16.4.2  徑向漸變 242 16.5  實戰題：漸變按鈕 248 16.6  實戰題：雞蛋圓 249 16.7  本章練習 250 第 17章  邊框樣式 251 17.1  邊框樣式簡介 251 17.2  圓角效果：border-radius 251 17.2.1  border-radius實現圓角 252 17.2.2  border-radius實現半圓和圓 256 17.2.3  border-radius實現橢圓 258 17.2.4  border-radius的派生子屬性 260 17.3  邊框陰影：box-shadow 260 17.3.1  box-shadow屬性簡介 260 17.3.2  4個方向陰影獨立樣式 265 17.4  多色邊框：border-colors 266 17.5  邊框背景：border-image 269 17.5.1  border-image屬性簡介 269 17.5.2  border-image的派生子屬性 272 17.6  實戰題：3D卡通頭像 273 17.7  本章練習 276 第 18章  背景樣式 279 18.1  背景樣式簡介 279 18.2  背景大小：background-size 279 18.3  背景位置：background-origin 282 18.4  背景剪切：background-clip 285 18.5  多背景圖片 288 18.6  本章練習 290 第 19章  CSS3變形 291 19.1  CSS3變形簡介 291 19.2  平移：translate() 292 19.3  縮放：scale() 296 19.4  傾斜：skew() 300 19.5  旋轉：rotate() 304 19.6  中心原點：transform-origin 305 19.7  實戰題：個性照片牆 307 19.8  本章練習 309 第 20章  CSS3過渡 310 20.1  CSS3過渡簡介 310 20.2  過渡屬性：transition-property 312 20.3  過渡時間：transition-duration 313 20.4  過渡方式：transition- timing-function 315 20.5  延遲時間：transition-delay 317 20.6  深入了解transition屬性 318 20.6.1  transition-property取值為all 318 20.6.2  transition-delay的省略 320 20.6.3  transition屬性的位置 320 20.7  實戰題：鼠標指針移上去顯示內容 321 20.8  實戰題：圖片文字介紹滑動效果 323 20.9  實戰題：白光閃過效果 326 20.10  實戰題：脈動效果 327 20.11  實戰題：手風琴效果 328 20.12  本章練習 330 第 21章  CSS3動畫 331 21.1  CSS3動畫簡介 331 21.2  @keyframes 333 21.3  動畫名稱：animation-name 335 21.4  持續時間：animation-duration 338 21.5  動畫方式：animation- timing-function 340 21.6  延遲時間：animation-delay 342 21.7  播放次數：animation- iteration-count 343 21.8  播放方向：animation-direction 345 21.9  播放狀態：animation-play-state 347 21.10  實戰題：脈衝動畫 348 21.11  實戰題：loading效果 350 21.12  本章練習 352 第 22章  多列布局 353 22.1  多列布局 353 22.2  列數：column-count 354 22.3  列寬：column-width 356 22.4  間距：column-gap 358 22.5  邊框：column-rule 360 22.6  跨列：column-span 362 22.7  實戰題：瀑布流布局 364 22.8  本章練習 366 第 23章  濾鏡效果 367 23.1  濾鏡效果簡介 367 23.2  亮度：brightness() 368 23.3  灰度：grayscale() 369 23.4  復古：sepia() 370 23.5  反色：invert() 371 23.6  旋轉：hue-rotate() 372 23.7  陰影：drop-shadow() 373 23.8  透明度：opacity() 374 23.9  模糊度：blur() 375 23.10  對比度：contrast() 376 23.11  飽和度：saturate() 377 23.12  多種濾鏡 378 23.13  實戰題：鬼屋 379 23.14  本章練習 381 第 24章  彈性盒子模型 382 24.1  彈性盒子模型簡介 382 24.2  放大比例：flex-grow 385 24.3  縮小比例：flex-shrink 387 24.4 &nb素寬度：flex-basis 389 24.5  復合屬性：flex 391 24.6  排列方向：flex-direction 392 24.7  多行顯示：flex-wrap 394 24.8  復合屬性：flex-flow 396 24.9  排列順序：order 397 24.10  水平對齊：justify-content 399 24.11  垂直對齊：align-items 401 24.12  實戰題：水平居中和垂直居中 404 24.13  實戰題：伸縮菜單 405 24.14  本章練習 407 第 25章  其他樣式 408 25.1  outline屬性 408 25.2  initial取值 409 25.3  calc()函數 410 25.4  overflow-x和overflow-y 413 25.5  pointer-events屬性 417 25.6  本章練習 418 附錄A  HTML素 420 附錄B  HTML5新增屬性 422 附錄C  CSS3新增選擇器 423 附錄D  CSS3新增屬性 425