內(nèi)容簡介
本書是HTML 5與CSS 3領域公認的標桿之作,被讀者譽為“系統(tǒng)學習HTML 5與CSS 3的標準著作”,也是Web前端工程師案頭必備工作手冊。
前3版累計印刷超過25次,網(wǎng)絡書店評論超過14000條,98%以上的評論都是五星級好評。不僅是HTML 5與CSS 3圖書領域當之無愧的領頭羊,而且在整個原創(chuàng)計算機圖書領域也是佼佼者。
第4版首先從技術的角度根據(jù)*新的HTML 5和CSS 3標準進行了更新和補充,其次是根據(jù)讀者的反饋對內(nèi)容的組織結構和寫作方式做了進一步的優(yōu)化,內(nèi)容更實用,閱讀體驗也更好。
全書共26章,本書分為上下兩冊:
上冊(1~14章)
全面系統(tǒng)地講解了HTML 5相關的各項主要技術,以HTML 5對現(xiàn)有Web應用產(chǎn)生的變革開篇,順序講解了HTML 5與HTML 4的區(qū)別、HTML 5的結構、表單及新增頁面元素、ECMAScript、文件API、本地存儲、XML HttpRequest、Web Workers、Service Worker、通信API、Web組件、繪制圖形、多媒體等內(nèi)容。
下冊(15~26章)
全面系統(tǒng)地講解了CSS 3相關的各項主要技術,以CSS 3的功能和模塊結構開篇,順序講解了各種選擇器、文字與字體、盒相關樣式、背景與邊框、變形處理、動畫、布局、多媒體,以及CSS 3中的一些其他重要樣式。
全書一共300余個示例頁面和1個綜合性的案例,所有代碼均通過作者上機調試,讀者可下載書中代碼,直接在瀏覽器查看運行結果。
(1)本書已經(jīng)成為HTML5與CSS3領域公認的標桿著作,是開發(fā)者們學習HTML5與CSS3的事實標準。
(2)前3版累計印刷超過25次,銷量超過10萬冊,網(wǎng)絡書店評論14000余條,好評率99%,是同類書中的領頭羊,也是原創(chuàng)計算機圖書領域的佼佼者。
(3)針對HTML5與CSS3技術的發(fā)展和Web應用環(huán)境的變化做了有針對性的優(yōu)化、更新、補充和刪除,內(nèi)容更有針對性,也更實用。
為何寫作本書?
如果要盤點2010年IT屆的十大熱門技術,云計算、移動開發(fā)、物聯(lián)網(wǎng)等無疑會在其中,HTML 5肯定也是少不了的。2010年,隨著HTML 5的迅猛發(fā)展,各大瀏覽器開發(fā)公司(如Google、微軟、蘋果、Mozilla和Opera)的瀏覽器開發(fā)業(yè)務都變得異常繁忙。在整個2010年度,無論是Mozilla的Firefox、Google的 Chrome、蘋果的Safari、微軟的Internet Explorer,還是歐普拉的Opera都處于不斷推陳出新的狀態(tài)當中。
2010年3月,在微軟的MIX2010大會上,微軟的工程師在介紹Internet Explorer 9瀏覽器的同時,還從前端技術的角度把互聯(lián)網(wǎng)的發(fā)展分為了三個階段:
第一階段:Web 1.0的以內(nèi)容為主的網(wǎng)絡,前端主流技術是HTML和CSS;
第二階段:Web 2.0的Ajax應用,熱門技術是JavaScript、DOM、異步數(shù)據(jù)請求;
第三階段:即將迎來的HTML 5時代,亮點是富圖形和富媒體內(nèi)容(Graphically-Rich and Media-Rich)。
前端技術將進入一個嶄新的時代,至少已經(jīng)開啟了這扇門。
在這種局勢下,學習HTML 5無疑成為Web開發(fā)者的一大重要任務,誰先學會HTML 5,誰就掌握了邁向未來Web平臺的方向。因此,我希望能夠借助本書幫助國內(nèi)的Web開發(fā)者更好地學習HTML 5以及與之相伴的CSS 3技術,使大家能夠早日運用這些技術開發(fā)出一個具有現(xiàn)代水平的、在未來的Web平臺上能夠正常運行的Web網(wǎng)站或Web應用程序。
第4版與第3版的區(qū)別
自2016年上半年本書第3版出版以來,一直受到廣大讀者的歡迎,筆者在這里首先感謝廣大讀者的支持。自本書第3版出版之后,HTML 5與CSS 3標準不斷發(fā)展,2016年11月,W3C發(fā)布HTML 5.1版本;2017年12月,W3C發(fā)布HTML 5.2版本。各主流瀏覽器也以最快的速度對HTML 5中各種最新公布的API提供了支持,其中包括對ECMA Script 2015以上版本的支持、對indexedDB 2.0版本的支持、對Fetch API的支持、改用Service Worker對離線應用程序提供支持、對BroadcastChannel API的支持、對Web組件模塊(其中包括HTML模塊、Shadow DOM、自定義元素、HTML導入)的支持、對Web Animations API的支持等。因此,本書第4版以第3版的內(nèi)容為基礎,添加2016年上半年到2018年上半年之間HTML 5中新增的各種元素及API,同時更新各主流瀏覽器CSS 3的最新支持情況,以使讀者能夠學到HTML 5與CSS 3標準中的各種知識,了解各種最新的瀏覽器中對HTML 5與CSS 3標準的最新支持情況,以幫助讀者能夠早日將這些新的知識打造成一個HTML 5時代的功能強大的Web網(wǎng)站或Web應用程序。
具體來說,在第4版在第3版的基礎上做出的主要修改如下所示:
第2章“HTML5與HTML4的區(qū)別”中刪除在HTML 5.1中被移除的元素。
新增第5章“ECMAScript中的新增功能”。
第7章“本地存儲”(原書中第8章)中新增indexedDB 2.0部分。
第8章“擴展的XMLHttpRequest API”(原書中第13章)修改為“擴展的XMLHttp-Request API及Fetch API”,新增8.4節(jié)“使用Fetch API”。
新增第10章“使用Service Worker實現(xiàn)離線應用程序”。
第11章“通信API”中新增11.4節(jié)“BroadcastChannel API”。
新增第12章“Web組件”。
第13章“繪制圖形” (原書中第5章)中新增13.9.3節(jié)“將canvas元素中的圖像轉換為Blob對象”與13.9.5節(jié)“解碼圖像”。
第18章“文字與字體相關樣式”中新增18.4節(jié)“指定用戶是否可選取文字的user-select屬性”。
第22章“CSS3中的動畫功能”中新增22.3節(jié)“Web Animations API”。
第23章“布局相關樣式”中新增23.4節(jié)“網(wǎng)格布局”。
第24章“Media Queries相關樣式”一章修改為第24章“媒體查詢表達式與特性查詢表達式”,新增24.2節(jié)“特性查詢表達式”。
第25章“CSS 3的其他重要樣式和屬性”中新增25.4節(jié)“用于控制鼠標事件的pointer-events屬性”與25.6節(jié)“CSS變量”。
本書面向的讀者
本書主要適合如下人群閱讀:
具有一定基礎的Web前端開發(fā)工程師
具有一定美術功底的Web前端設計師和UI設計師
Web項目的管理人員
開設了Web開發(fā)等相關專業(yè)的高等院校師生和相關培訓機構的學員及教師
如何閱讀本書
本書從邏輯上共分為三個部分:
第一部分(第1~14章) 對HTML 5中新增的語法與標記方法、新增的元素、新增的API以及到本書截稿時這些元素與API受到了哪些瀏覽器的支持等進行了詳細介紹。在對它們進行介紹的同時將其與HTML 4中的各種元素與功能進行了對比,以幫助讀者更好地理解為什么需要使用HTML 5、使用HTML 5有什么好處、HTML 5中究竟增加了哪些目前HTML 4不具備而在第三代Web平臺上將會起到重要作用的功能與API,以及這些功能與API的詳細使用方法。
第二部分(第15~25章) 詳細介紹了CSS 3中的各種新增樣式與屬性,其中主要包括CSS 3中的各種選擇器、文字與字體、背景與邊框、各種盒模型、CSS 3中的布局方式、CSS 3中的變形與動畫、CSS 3中與媒體類型相關的一些樣式與屬性等。在介紹的同時也詳細講述了到本書截稿時這些樣式與屬性受到了哪些瀏覽器的支持,以及針對各種瀏覽器應該怎樣在樣式代碼中進行各種屬性的正確書寫。
第三部分(第26章) 詳細講解了一個實例,該實例展示了如何使用HTML 5中新增的表單元素、如何讀取本地數(shù)據(jù)庫中的數(shù)據(jù)、如何保存數(shù)據(jù)到本地數(shù)據(jù)庫、如何使用Fetch API讀取服務器端的數(shù)據(jù)及提交數(shù)據(jù)到服務器端并處理服務器端響應、如何保存數(shù)據(jù)到LocalStorage及從LocalStorage讀取保存后的數(shù)據(jù)、從而實現(xiàn)一個具有現(xiàn)代風格的Web應用程序,如何在這個由HTML 5語言及其功能編寫而成的Web應用程序中綜合使用CSS 3樣式來完成頁面的布局以及視覺效果的美化工作。
全書一共有300多個代碼示例,每個代碼示例都經(jīng)過筆者上機實踐,確保運行結果正確無誤。每個代碼示例的詳細代碼及其用到的腳本文件、各種資源文件都可在華章公司的官方網(wǎng)站(www.hzbook.com)本書的頁面上下載,因為是用HTML 5編寫的網(wǎng)頁,所以這些文件可直接在各種瀏覽器中打開并查看運行結果。少量頁面需要首先建立網(wǎng)站,然后通過訪問網(wǎng)站中該頁面的方式來進行查看,少量頁面使用服務器端PHP腳本語言,可在Apache服務器中運行。書中詳細介紹了對HTML 5中的各種元素、各種API和CSS 3中的各種屬性和樣式提供支持的瀏覽器,讀者可以針對不同的頁面選擇正確的瀏覽器來查看其正確的運行結果。
致謝
在本書的寫作過程中,策劃編輯楊福川先生和李藝女士給予了很大的幫助和支持,并提出了很多中肯的建議,在此表示感謝。同時,還要感謝機械工業(yè)出版社的所有編審人員為本書的出版所付出的辛勤勞動。本書的成功出版是大家共同努力的結果,謝謝你們。
另外,在本書的寫作過程當中,由于時間及水平上的原因,可能存在一些對HTML 5及CSS 3上認識不全面或疏漏的地方,敬請讀者批評更正,作者的聯(lián)系QQ為240824399,聯(lián)系郵箱為240824399@qq.com,謹以最真誠的心希望能與讀者交流,共同成長。
作者簡介
陸凌牛
Web開發(fā)工程師、軟件開發(fā)工程師和系統(tǒng)設計師。從事Web開發(fā)多年,對各種Web開發(fā)技術(包括前端和后端)都有非常深入的研究,經(jīng)驗極其豐富。HTML 5和CSS 3等新技術的先驅者和布道者,不僅對HTML 5與CSS 3有非常深入的研究,而且對Node.JS等開發(fā)框架也有非常深刻的研究,并且付諸了大量實踐。同時,他還擅長.NET和Java的相關技術,在C#、VB.NET、ASP.NET、SQL Server 、Oracle、Java、Struts、Spring、Hibernate等方面也積累大量的實戰(zhàn)經(jīng)驗。
此外,他還是一位頗有影響力的技術作家:
(1)《HMTL 5與CSS 3指南》憑借優(yōu)質的內(nèi)容深受讀者好評,同類書只能望其項背。前3版累計印刷超過25次,銷量超過10萬冊,被讀者譽為“系統(tǒng)學習HTML 5與CSS 3的更好選擇”和“Web前端工程師案頭必備圖書之一”, 不僅是HTML 5與CSS 3領域的領頭羊和標桿,而且是近年來原創(chuàng)計算機圖書領域的一面旗幟。
(2)《HTML 5開發(fā)精要與案例詳解》、《Sencha Touch指南》、《Node.js指南》等著作同樣也取得了非常好的口碑和銷量。
前言
上冊
第1章 Web時代的變遷 1
1.1 迎接新的Web時代 1
1.1.1 HTML 5時代即將來臨1
1.1.2 HTML 5的目標3
1.1.3 HTML5的小版本更新4
1.2 HTML 5深受歡迎的理由 4
1.2.1 世界知名瀏覽器廠商對HTML 5的支持4
1.2.2 第一個理由:時代的要求5
1.2.3 第二個理由:Internet Explorer 85
1.3 可以放心使用HTML 5的三個理由 6
1.4 HTML 5要解決的三個問題 7
第2章 HTML 5與HTML 4的區(qū)別8
2.1 語法的改變 8
2.1.1 HTML 5的語法變化8
2.1.2 HTML 5中的標記方法9
2.1.3 HTML 5確保的兼容性10
2.1.4 標記示例11
2.2 新增的元素和廢除的元素 12
2.2.1 新增的結構元素12
2.2.2 新增的其他元素14
2.2.3 新增的input元素的類型18
2.2.4 廢除的元素18
2.3 新增的屬性和廢除的屬性 19
2.3.1 新增的屬性19
2.3.2 廢除的屬性21
2.4 全局屬性 23
2.4.1 contentEditable屬性23
2.4.2 designMode屬性24
2.4.3 hidden屬性24
2.4.4 spellcheck屬性25
2.4.5 tabindex屬性25
2.5 新增的事件 25
2.6 只監(jiān)聽一次事件 26
第3章 HTML 5的結構 28
3.1 新增的主體結構元素 28
3.1.1 article元素29
3.1.2 section元素31
3.1.3 nav元素33
3.1.4 aside元素34
3.1.5 time元素與微格式36
3.1.6 pubdate屬性37
3.2 新增的非主體結構元素 38
3.2.1 header元素38
3.2.2 footer元素39
3.2.3 address元素40
3.2.4 main元素41
3.3 HTML 5中網(wǎng)頁結構 42
3.3.1 HTML 5中的大綱42
3.3.2 大綱的編排規(guī)則48
3.3.3 對新的結構元素使用樣式51
第4章 表單及其他新增和改良元素 53
4.1 新增元素與屬性 53
4.1.1 新增屬性53
4.1.2 大幅度地增加與改良input元素的種類65
4.1.3 對新的表單元素使用樣式77
4.1.4 output元素的追加77
4.2 表單驗證 78
4.2.1 自動驗證78
4.2.2 取消驗證79
4.2.3 顯式驗證79
4.3 增強的頁面元素 80
4.3.1 新增的figure元素與figcaption元素80
4.3.2 新增的details元素與summary元素82
4.3.3 新增的mark元素83
4.3.4 新增的progress元素86
4.3.5 新增的meter元素87
4.3.6 新增的dialog元素88
4.3.7 改良的a元素90
4.3.8 改良的ol列表91
4.3.9 改良的dl列表92
4.3.10 加以嚴格限制的cite元素93
4.3.11 重新定義的small元素94
4.3.12 安全性增強的iframe元素94
4.3.13 增強的script元素97
第5章 ECMAScript中的新增功能 102
5.1 新增語法 103
5.1.1 使用for-of循環(huán)103
5.1.2 使用let關鍵字與const關鍵字聲明變量104
5.1.3 使用class關鍵字聲明類109
5.1.4 不確定參數(shù)及默認參數(shù)值116
5.1.5 箭頭函數(shù)121
5.1.6 生成器函數(shù)126
5.1.7 解構賦值129
5.1.8 模板字符串138
5.1.9 在客戶端使用JavaScript模塊141
5.2 新增對象及數(shù)據(jù)類型 145
5.2.1 Promise對象145
5.2.2 全局唯一標識符:symbol 166
5.2.3 代理與反射 170
5.2.4 新增的各種集合對象 176
5.3 對現(xiàn)有對象的擴展 187
第6章 文件API 194
6.1 FileList對象與file對象 195
6.2 ArrayBuffer對象與ArrayBuffer-View對象 196
6.2.1 基本概念196
6.2.2 ArrayBuffer對象196
6.2.3 ArrayBufferView對象196
6.2.4 DataView對象198
6.3 Blob對象 202
6.3.1 Blob對象概述202
6.3.2 創(chuàng)建Blob對象204
6.3.3 Blob對象的slice方法207
6.4 FileReader對象 208
6.4.1 FileReader對象的方法208
6.4.2 FileReader對象的事件209
6.4.3 FileReader對象的使用示例209
第7章 本地存儲 217
7.1 Web Storage 218
7.1.1 Web Storage是什么218
7.1.2 簡單Web留言本221
7.1.3 作為簡易數(shù)據(jù)庫來利用224
7.1.4 利用storage事件實時監(jiān)視Web Storage中的數(shù)據(jù)226
7.2 indexedDB數(shù)據(jù)庫 229
7.2.1 本地數(shù)據(jù)庫的基本概念229
7.2.2 indexedDB數(shù)據(jù)庫的基本概念229
7.2.3 連接數(shù)據(jù)庫229
7.2.4 數(shù)據(jù)庫的版本更新231
7.2.5 創(chuàng)建對象倉庫233
7.2.6 創(chuàng)建索引236
7.2.7 索引的multiEntry屬性值239
7.2.8 使用事務239
7.2.9 保存數(shù)據(jù)241
7.2.10 在indexedDB數(shù)據(jù)庫中保存Blob對象244
7.2.11 獲取數(shù)據(jù)247
7.2.12 根據(jù)主鍵值檢索數(shù)據(jù)251
7.2.13 根據(jù)搜索范圍獲取數(shù)據(jù)的主鍵值257
7.2.14 根據(jù)索引屬性值檢索數(shù)據(jù)260
7.2.15 獲取所有數(shù)據(jù)266
7.2.16 復合索引272
7.2.17 統(tǒng)計對象倉庫中的數(shù)據(jù)數(shù)量276
7.2.18 列舉數(shù)據(jù)庫中所有對象倉庫的名稱278
7.2.19 列舉事務中所有可訪問對象倉庫名稱279
7.2.20 刪除對象倉庫281
7.2.21 根據(jù)主鍵刪除單條數(shù)據(jù)282
7.2.22 列舉對象倉庫的所有索引名稱及刪除索引286
7.2.23 使用索引對象的方法289
7.2.24 在指定范圍中抽取數(shù)據(jù)主鍵298
7.2.25 使用游標對象的方法301
第8章 擴展的XMLHttpRequestAPI及FetchAPI 307
8.1 從服務器端獲取二進制數(shù)據(jù) 307
8.1.1 ArrayBuffer響應 308
8.1.2 Blob響應 313
8.2 發(fā)送數(shù)據(jù) 314
8.2.1 發(fā)送字符串 315
8.2.2 發(fā)送表單數(shù)