編輯推薦

　　針對新版本瀏覽器，討論亟待解決的實際問題。
　　每一章分彆聚焦某特定問題，通過多個實例介紹特定概念並引導讀者創建簡單示例，進而得到解決方案。
　　實例後附有“迴退方案”，為舊版本瀏覽器提供解決方法。
　　“未來展望”探討如何在將來更好地應用屆時已經成熟的新特性。

內容簡介

　　HTML5和CSS3技術是目前整個網頁的基礎。《HTML5與CSS3實例教程(第2版)》共分3部分，集中討論瞭HTML5和CSS3規範及其技術的使用方法。這一版全麵講解瞭最新的HTML5和CSS3技術，所有實例均使用最新特性實現，針對的是最新版本的瀏覽器。
　　《HTML5與CSS3實例教程(第2版)》適閤所有使用HTML和CSS的Web開發人員學習參考。

作者簡介

　　Brian P. Hogan，1995年起便開始以自由職業者的身份開發專業網站並提供谘詢服務，目前常使用Ruby、jQuery、HTML5和CSS3構建Web應用。他樂於講述並撰寫與Web設計和開發有關的內容，倡導為殘障人士（特彆是視覺障礙者）研發輔助功能，另著有《Web開發秘方》。

內頁插圖

精彩書評

　　“要想在業內競爭中不掉隊，就得不斷學習、與時俱進。對於Web設計者和開發者而言，這是一本關於HTML5和CSS3的必讀、高效的參考資料。不要把它擱置在書架上，而應放在案頭以備隨時翻閱。”
　　—— Matt Margolis，Getty Images應用開發經理

　　“本書就像一個Web開發百寶箱，內容通俗易懂、組織精良，並裝滿瞭‘乾貨’。Brian不愧是一位自信的專傢和高水平的講師。”
　　——Tibor Simic，Inge-mark開發人員

　　“我已經有十多年的網站開發經驗，但仍能從本書中學到許多技巧。如果你還未觸及HTML5的新特性，那還等什麼？本書將告訴你可以做什麼，應該如何做，以及何時做。”
　　——Stephen Orr，Made Media首席開發專傢

目錄

第1章　HTML5和CSS3概述
1.1　強大的Web開發平颱
1.1.1　嚮後兼容
1.1.2　更具描述性的標記
1.1.3　更加簡化
1.1.4　用戶界麵增強
1.1.5　更好的錶單控件
1.1.6　可訪問性增強
1.1.7　更高級的選擇器
1.1.8　視覺效果
1.1.9　更少依賴插件的多媒體功能實現
1.1.10　應用能力增強
1.1.11　跨文檔通信
1.1.12　Web Sockets
1.1.13　客戶端存儲
1.2　注定充滿挑戰的未來之路
1.2.1　處理老版本的IE
1.2.2　可訪問性
1.2.3　廢棄的標簽
1.2.4　市場利益的激烈競爭
1.2.5　HTML5和CSS3的標準仍在不斷發展中

第一部分　用戶界麵增強
第2章　新的結構化標簽和屬性
2.1　實例1：用語義標記重新定義博客
2.1.1　一切皆始於正確的文檔類型
2.1.2　頁眉標簽
2.1.3　頁腳標簽
2.1.4　導航標簽
2.1.5　區塊和文章
2.1.6　旁白與側邊欄
2.1.7　為博客設置樣式
2.1.8　迴退方案
2.2　實例2：用元素實現進度條
2.2.1　迴退方案
2.2.2　進度條標簽
2.3　實例3：用自定義數據屬性構造彈齣窗體
2.3.1　行為與內容分離，以及
onclick()的問題
2.3.2　增強可訪問性
2.3.3　不用onclick()
2.3.4　引入自定義數據屬性
2.3.5　迴退方案
2.4　實例4：常見問題描述列錶
2.5　未來展望
第3章　創建友好的Web錶單
3.1　實例5：使用新的輸入字段描述數據
3.1.1　錶單描述
3.1.2　使用範圍字段創建滑動條
3.1.3　使用選值框處理數值
3.1.4　日期選擇字段
3.1.5　電子郵件字段
3.1.6　URL字段
3.1.7　顔色選擇字段
3.1.8　給錶單設置樣式
3.1.9　迴退方案
3.2　實例6：藉助autofocus跳到錶單第一個字段
3.3　實例7：通過占位文本提供提示信息
3.4　實例8：不藉助JavaScript驗證用戶輸入
3.4.1　正則錶達式驗證
3.4.2　為字段添加樣式
3.4.3　迴退方案
3.5　實例9：通過contenteditable屬性實現就地編輯功能
3.5.1　用戶資料錶單
3.5.2　數據持久化
3.5.3　迴退方案
3.6　未來展望
第4章　設置內容及界麵的樣式
4.1　實例10：使用僞類設置錶格樣式
4.1.1　使用:nth-of-type給錶格行設置條紋
4.1.2　使用:nth-child對齊錶格列的內容
4.1.3　使用:last-child加粗錶格最後一行
4.1.4　使用:nth-last-child反嚮遍曆元素
4.1.5　迴退方案
4.2　實例11：使用:after和content生成打印友好的鏈接
4.2.1　創建隻適用於打印的樣式錶
4.2.2　雙冒號語法
4.3　實例12：使用媒體查詢構建移動頁麵
4.4　實例13：創建多欄布局
4.4.1　拆分欄
4.4.2　特定廠商的前綴
4.4.3　迴退方案
4.5　未來展望
第5章　構建可訪問性界麵
5.1　實例14：使用ARIA role屬性提供導航提示
5.1.1　地標角色
5.1.2　文檔結構角色
5.1.3　迴退方案
5.2　實例15：創建訪問性良好的可更新區域
5.2.1　創建頁麵
5.2.2　隱藏內容區域
5.2.3　迴退方案
5.3　實例16：提升錶格的可訪問性
5.3.1　把標題與列結閤起來
5.3.2　用題注和描述解釋錶格
5.4　未來展望

第二部分　新視角、新聲音
第6章　在瀏覽器中畫圖
6.1　實例17：在畫布上繪製商標
6.1.1　繪製綫條
6.1.2　添加"AwesomeCo"文本信息
6.1.3　移動原點坐標
6.1.4　為對象設置漸變效果
6.1.5　迴退方案
6.2　實例18：使用RGraph實現圖錶統計
6.2.1　使用HTML描述數據
6.2.2　將HTML描述內容轉換成柱狀圖
6.2.3　顯示替代內容
6.2.4　迴退方案
6.3　實例19：使用SVG繪製矢量圖形
6.3.1　繪製綫條
6.3.2　添加文本信息
6.3.3　繪製形狀
6.3.4　通過路徑進行手工繪製
6.3.5　迴退方案
6.4　未來展望
第7章　嵌入音頻和視頻
7.1　曆史迴顧
7.2　容器與編解碼器
7.2.1　視頻編解碼器
7.2.2　音頻編解碼器
7.2.3　容器與編解碼器協同工作
7.3　實例20：音頻特性
7.3.1　創建基本的音頻列錶
7.3.2　迴退方案
7.4　實例21：嵌入視頻
7.5　實例22：視頻播放的可訪問性
7.5.1　添加字幕
7.5.2　HTML5視頻技術的局限性
7.6　未來展望
第8章　視覺特效
8.1　實例23：設置圓角
8.1.1　柔化登錄錶單
8.1.2　迴退方案
8.2　實例24：陰影、漸變及轉換
8.2.1　基本結構
8.2.2　添加漸進效果
8.2.3　添加陰影效果
8.2.4　鏇轉姓名牌
8.2.5　使用矩陣精確轉換
8.2.6　透明背景
8.2.7　迴退方案
8.3　實例25：設置字體
8.3.1　@font-face
8.3.2　字體格式
8.3.3　改變字體
8.3.4　迴退方案
8.4　實例26：通過過渡和動畫特性移動物體
8.4.1　使用CSS過渡特性實現淡入淡齣效果
8.4.2　理解調速函數
8.4.3　創建過渡特效
8.4.4　利用CSS3動畫特性實現錶單晃動效果
8.4.5　迴退方案
8.5　未來展望

第三部分　標記之外
第9章　客戶端數據儲存
9.1　實例27：用Web Storage存儲偏好設置
9.1.1　創建偏好設置錶單
9.1.2　保存及恢復偏好設置數據
9.1.3　為頁麵應用偏好設置值
9.1.4　迴退方案
9.2　實例28：使用IndexedDB將數據存儲到客戶端數據庫中
9.2.1　注意事項界麵
9.2.2　創建並連接數據庫
9.2.3　創建注意事項錶
9.2.4　加載注意事項
9.2.5　讀取特定記錄
9.2.6　創建、更新以及刪除記錄
9.2.7　迴退方案
9.3　實例29：離綫應用
9.3.1　通過manifest文件定義應用程序緩存
9.3.2　manifest文件與服務器端緩存設置
9.3.3　檢測網絡連通性
9.4　未來展望
第10章　創建交互式Web應用
10.1　實例30：保存曆史記錄
10.1.1　存儲當前狀態
10.1.2　恢復上一狀態
10.1.3　設置默認狀態
10.1.4　迴退方案
10.2　實例31：跨域通信
10.2.1　聯係人列錶
10.2.2　發送消息
10.2.3　支持網站
10.2.4　接收消息
10.2.5　IE 8及IE 9中的限製
10.3　實例32：WebSocket聊天
10.3.1　聊天界麵
10.3.2　與聊天服務器的通信
10.3.3　迴退方案
10.3.4　Flash Socket策略文件
10.4　實例33：你在哪兒：Geolocation
10.4.1　為AwesomeCo公司開發定位功能
10.4.2　如何被找到
10.4.3　迴退方案
10.5　實例34：通過拖放來整理內容
10.5.1　創建基本用戶界麵
10.5.2　添加卡片到界麵
10.5.3　整理卡片
10.5.4　迴退方案
10.6　未來展望
第11章　未來之路
11.1　使用彈性盒子模型定義布局
11.2　跨域資源共享
11.3　Web Workers
11.4　服務器發送事件
11.4.1　監聽事件
11.4.2　實現你自己的服務器
11.5　濾鏡效果
11.6　WebGL
11.7　前進！

附錄A　快速參考
附錄B　jQuery快速入門
附錄C　針對Web的音頻和視頻編碼
附錄D　相關資源

參考文獻

前言/序言

　　對Web開發者來說，Web世界中的三個月猶如真實世界的一年。也就是說，自本書上一版齣版至今已經有12個“Web年”瞭。
　　作為Web開發者，總能耳聞目睹一些新的技術趨勢。在幾年以前，HTML5和CSS3看起來還很遙遠，但由於當前各種瀏覽器，如Chrome、Safari、Firefox、Opera以及IE等，都在努力實現HTML5和CSS3規範中的各項內容，因而現今企業和組織也都在業務係統的建設過程中紛紛采用這些新技術。
　　如何閱讀本書
　　沒有必要從頭至尾閱讀本書。本書已經將內容分解成瞭便於單獨理解與學習的各個實例，每個實例都聚焦於一到兩個核心概念。每一章都會涉及一些相關項目。如果你下載瞭本書源代碼，將看到一個template/文件夾，其中包含瞭將要用到的通用模闆文件，這將會是一個不錯的著手點。
　　如下示例代碼的第一行標注瞭該示例代碼文件在本書源代碼中的位置：
　　html5_new_tags/index.html
　　
　　如果你閱讀的是英文電子版，可以點擊該標注來打開整個示例代碼文件，以便在上下文中查看代碼。這個標注指齣瞭示例代碼文件在本書源代碼中的位置，但它也許並不總是與你實際操作的文件相匹配。
　　最後，請跟隨本書代碼，放心大膽地練習和調整本書提供的完整示例代碼。接下來，讓我們來詳細瞭解一下運行本書示例代碼之前應做何種準備。
　　準備工作
　　你需要Firefox 20或更高版本、Chrome 20或更高版本、Opera 10.6或者Safari 6等瀏覽器來測試本書代碼。由於每款瀏覽器在功能實現上都會有一些差彆，因此，你可能還希望在所有瀏覽器上都測試我們編寫的代碼。有一颱Android或iOS設備在手邊會很有幫助，但不是必需的。
　　在IE瀏覽器上進行測試工作
　　你同時也應該考慮到使用IE 8及更高版本來測試網站功能的現實需要，這樣纔能確保我們創建的迴退解決方案運行無誤。最簡單的方式就是在VirtualBox上安裝微軟Windows來進行測試。微軟在Modern.IE網站上提供瞭免費的虛擬機，可用於測試Web應用程序，你可以從上麵下載現成可用的VirtualBox、Parallels或VMware鏡像文件。這些虛擬機軟件有30天的免費試用期，30天之後需要重新下載。
　　Node.js與示例服務器
　　測試書中的某些特性時，需要通過一個Web應用服務器來運行HTML和CSS文件。另外，測試其他的一些特性時也需要一個相對復雜的後颱應用服務。本書源代碼中提供瞭一個應用服務器，可以滿足你的需要。要運行這個服務器，你需要事先按照Node.js網站上的相關說明安裝好Node.js，並需要0.10.0或以上版本的Node.js，以避免服務器崩潰。
　　你還需要用到npm，這是一個命令行工具，用來安裝Node打包模塊，因此，你可以用它來安裝依賴模塊。這個工具是Node.js安裝文件中的一部分。
　　一旦安裝好瞭Node.js，就可以訪問本書站點並下載示例代碼。對壓縮文件進行解壓，然後通過終端窗口（在Windows平颱則是命令行窗口）進入解壓後的文件所在位置，並運行以下命令，下載所有的依賴模塊（注意不包括$符號）：
　　$ npm install
　　之後輸入以上命令，同樣不要輸入$符號：
　　$ node server
　　我們需要在端口8000上運行應用服務器。在瀏覽器中加載，就可以瀏覽應用示例瞭。如果你在虛擬機上進行測試，虛擬機應該使用運行示例服務器的計算機的真實IP地址來連接。最棒的是，與server文件放置在同一文件夾裏的文件與文件夾將會通過示例服務器來運行，因此，你可以直接使用本書源代碼文件夾的既有組織方式，來跟隨本書內容按部就班地進行學習。
　　使用JavaScript和jQuery的注意事項
　　在本書中，我們將大量使用JavaScript。在過去，在頁麵標簽裏加載JavaScript文件是一種很常用的實踐方式，之後使用諸如jQuery的document.ready()方法來等待DOM（Document Object Model，文檔對象模型）準備就緒，以對DOM進行操作。但是現在的推薦做法是在頁麵底部加載所有的腳本，這樣可以獲得更好的性能。因此，我們也將這麼做，所有的腳本包括jQuery，都將放在頁麵底部，但是需要在元素加載之前對DOM進行操作的場景除外。
　　此外，我們將在閤適的地方使用jQuery，如果隻是打算簡單地通過元素ID來查找某個元素，我們將直接使用document.getElementById()。但如果需要進行事件處理或者更復雜的DOM操作以在IE8中實現迴退方案時，我們會考慮使用jQuery。
　　換而言之，我們要“根據任務的不同選擇閤適的工具”。這可能會帶來一些矛盾，但當我們開始介紹迴退方案以使應用在老式瀏覽器上正常運行時，這將是一個不錯的摺中辦法。在後麵，我會解釋為什麼要這樣做。

好好學習天天嚮上，不錯

還不錯

正在看，感覺還可以。

送給朋友的生日禮物

給美工買的，在認真學習！

不錯，講的非常詳細，值得擁有

很好，很好，我覺得雖然書薄，但是精闢

很有用，認真學習下來兩個星期應該就能搞定。。。

送來有點褶皺， 其他的還可以