『壹』 什麼HTML5最近好像挺火的
HTML5是用於取代1999年所制定的 HTML 4.01 和 XHTML 1.0 標準的 HTML 標准版本，現在仍處於發展階段，但大部分瀏覽器已經支持某些 HTML5 技術。HTML 5有兩大特點：首先，強化了 Web 網頁的表現性能。其次，追加了本地資料庫等 Web 應用的功能。廣義論及HTML5時，實際指的是包括HTML、CSS和JavaScript在內的一套技術組合。它希望能夠減少瀏覽器對於需要插件的豐富性網路應用服務（plug-in-based rich internet application，RIA)，如Adobe Flash、Microsoft Silverlight，與Oracle JavaFX的需求，並且提供更多能有效增強網路應用的標准集。
HTML的特性
A. 語義特性（Class：Semantic）
HTML5賦予網頁更好的意義和結構。更加豐富的標簽將隨著對RDFa的，微數據與微格式等方面的支持，構建對程序、對用戶都更有價值的數據驅動的Web。
B. 本地存儲特性（Class: OFFLINE & STORAGE）
基於HTML5開發的網頁APP擁有更短的啟動時間，更快的聯網速度，這些全得益於HTML5 APP Cache，以及本地存儲功能。Indexed DB（html5本地存儲最重要的技術之一） 和API說明文檔。
C. 設備兼容特性 (Class: DEVICE ACCESS)
從Geolocation 功能的API文檔公開以來，HTML5為網頁應用開發者們提供了更多功能上的優化選擇，帶來了更多體驗功能的優勢。HTML5提供了前所未有的數據與應用接入開放介面。使外部應用可以直接與瀏覽器內部的數據直接相連，例如視頻影音可直接與microphones及攝像頭相聯
D. 連接特性（Class: CONNECTIVITY）
更有效的連接工作效率，使得基於頁面的實時聊天，更快速的網頁游戲體驗，更優化的在線交流得到了實現。HTML5擁有更有效的伺服器推送技術，Server-Sent Event和WebSockets就是其中的兩個特性，這兩個特性能夠幫助我們實現伺服器將數據』推送』到客戶端的功能。
E. 網頁多媒體特性(Class: MULTIMEDIA)
支持網頁端的Audio、Video等多媒體功能， 與網站自帶的APPS，攝像頭，影音功能相得益彰。
F. 三維、圖形及特效特性（Class: 3D, Graphics & Effects）
基於SVG、Canvas、WebGL及CSS3的3D功能，用戶會驚嘆於在瀏覽器中，所呈現的驚人視覺效果。
G. 性能與集成特性（Class: Performance & Integration）
沒有用戶會永遠等待你的Loading——HTML5會通過XMLHttpRequest2等技術，幫助您的Web應用和網站在多樣化的環境中更快速的工作。
H. CSS3特性(Class: CSS3)
在不犧牲性能和語義結構的前提下，CSS3中提供了更多的風格和更強的效果。此外，較之以前的Web排版，Web的開放字體格式（WOFF）也提供了更高的靈活性和控制性。
Html 5與Html 4的區別
A.簡化的語法
更簡單的doctype聲明是HTML5里眾多新特徵之一。現在你只需要寫，這就行了。HTML5的語法兼容HTML4和XHTML1，但不兼容SGML。
B. 一個替代Flash的新」canvas」標記
對於Web用戶來說，Flash既是一個驚喜，也是一種痛苦。有很多的Web開發人員對HTML5對Flash產生的威脅很不滿。但對於那些忍受著要花幾年時間載入和運行的臃腫的Flash視頻的人來說，用新的 「canvas」 標記生成視頻的技術已經到來。
目前， 「canvas」 標記並不能提供所有的Flash具有的功能，但假以時日，Flash必將從web上淘汰。我們拭目以待，因為很多人還並不認同這種觀點。
C. 新的 「header」 和 「footer」 標記
HTML5的設計是要更好的描繪網站的解剖結構。這就是為什麼這些」header」 和」footer」 等新標記的出現，它們是專門為標志網站的這些部分設計的。在開發網站時，你不在需要用」div」標記來標注網頁的這些部分。
D. 新的 「section」 和 「article」 標記
跟」header」 和 「footer」標記類似，HTML5中引入的新的」section」 和 「article」 標記可以讓開發人員更好的標注頁面上的這些區域。
據推測，除了讓代碼更有組織外，它也能改善SEO效果，能讓搜索引擎更容易的分析你的頁面。
E.新的 「menu」 和 「figure」 標記
新的」menu」標記可以被用作普通的菜單，也可以用在工具條和右鍵菜單上，雖然這些東西在頁面上並不常用。類似的，新的 「figure」 標記是一種更專業的管理頁面上文字和圖像的方式。當然，你可以用樣式表來控制文字和圖像，但使用HTML5內置的這個標記更適合。
F. 新的 「audio」 和 「video」 標記
新的」audio」 和 「video」 標記可能是HTML5中增加的最有用處的兩個東西了。正如標記名稱，它們是用來嵌入音頻和視頻文件的。
除此之外還有一些新的多媒體的標記和屬性，例如」track」，它是用來提供跟蹤視頻的文字信息的。有了這些標記，HTML5使Web2.0特徵變得越來越友好。問題在於，在HTML5還未被廣泛的接受之前，Web2.0還是老的Web2.0。
G. 全新的表單設計
新的 「form」 和 「forminput」 標記對原有的表單元素進行的全新的修改，它們有很多的新屬性(以及一些修改)。如果你經常的開發表單，你應該花時間更詳細的研究一下。
H. 不再使用 「b」 和 「font」 標記
對我個人來說，這是一個讓我不太理解的改動。我並不認為去除 「b」 和 「font」標記會帶來多大的好處。我知道，官方的指導說這些標記可以通過CSS來做更好的處理，但這樣一來，為了在文章一兩個地方出現的這種標記，你就需要在獨立的css和文本兩個地方來實現這一的功能，豈不笨拙。也許我們以後會習慣這種方法。
i. 不再使用 「frame」, 「center」, 「big」 標記
事實上，我已經記不清曾經何時用過這些標記了，所以，我並不為去除這些標記感到悲哀。相同的原因，有更好的標記能實現它們的功能——這很好，任何作廢的標記從標准中剔除都是受歡迎的。
改進與沿革
HTML5提供了一些新的元素和屬性，例如<nav>（網站導航塊）和<footer>。這種標簽將有利於搜索引擎的索引整理，同時更好的幫助小屏幕裝置和視障人士使用，除此之外，還為其他瀏覽要素提供了新的功能，如<audio>和<video>標記。
1.取消了一些過時的HTML4標記
其中包括純粹顯示效果的標記，如<font>和<center>，它們已經被CSS取代。
HTML5 吸取了XHTML2 一些建議，包括一些用來改善文檔結構的功能，比如，新的HTML 標簽 header, footer, dialog, aside, figure 等的使用，將使內容創作者更加語義地創建文檔，之前的開發者在實現這些功能時一般都是使用div。
2.將內容和展示分離
b 和 i 標簽依然保留，但它們的意義已經和之前有所不同，這些標簽的意義只是為了將一段文字標識出來，而不是為了為它們設置粗體或斜體式樣。u，font，center，strike 這些標簽則被完全去掉了。
3.一些全新的表單輸入對象
包括日期，URL，Email 地址，其它的對象則增加了對非拉丁字元的支持。HTML5 還引入了微數據，這一使用機器可以識別的標簽標注內容的方法，使語義Web 的處理更為簡單。總的來說，這些與結構有關的改進使內容創建者可以創建更干凈，更容易管理的網頁，這樣的網頁對搜索引擎，對讀屏軟體等更為友好。
4.全新的，更合理的Tag
多媒體對象將不再全部綁定在 object 或 embed Tag 中，而是視頻有視頻的Tag，音頻有音頻的 Tag。
5.本地資料庫
這個功能將內嵌一個本地的sql 資料庫，以加速互動式搜索，緩存以及索引功能。同時，那些離線Web 程序也將因此獲益匪淺。不需要插件的富動畫。
6.Canvas 對象
將給瀏覽器帶來直接在上面繪制矢量圖的能力，這意味著用戶可以脫離Flash 和Silverlight，直接在瀏覽器中顯示圖形或動畫。
7.瀏覽器中的真正程序
將提供 API 實現瀏覽器內的編輯，拖放，以及各種圖形用戶界面的能力。內容修飾Tag 將被剔除，而使用CSS。
8.Html5取代Flash在移動設備的地位。
重要標記
<video>標記
定義和用法：
<video> 標簽定義視頻，比如電影片段或其他視頻流。
<audio> 標記
定義和用法
<audio> 標簽定義聲音，比如音樂或其他音頻流。
實例：
一段簡單的HTML 5 音頻
<audio src="someaudio.wav">
您的瀏覽器不支持 audio 標簽。
</audio>
<canvas> 標記
定義和用法：
<canvas> 標簽定義圖形，比如圖表和其他圖像。
HTML5 的 canvas 元素使用JavaScript 在網頁上繪制圖像。
畫布是一個矩形區域，您可以控制其每一像素。
canvas 擁有多種繪制路徑、矩形、圓形、字元以及添加圖像的方法。
實例：
通過 canvas 元素來顯示一個紅色的矩形：
<canvas id="myCanvas"></canvas>
<script type="text/javascript">
var canvas=document.getElementById('myCanvas');
var ctx=canvas.getContext('2d');
ctx.fillStyle='#FF0000';
ctx.fillRect(0,0,80,100);
</script>
程序介面
除了原先的DOM介面，
HTML5增加了更多API,如：
1． 用於即時2D繪圖的Canvas標簽
2． 定時媒體回放
3． 離線資料庫存儲
4． 文檔編輯
5． 拖拽控制
6． 瀏覽歷史管理
元素變化
新的解析順序新的元素：section, video, progress, nav, meter, time, aside, canvasinput
元素的新屬性：日期和時間，email, url。
新的通用屬性：ping, charset, async
全域屬性：id, tabindex, repeat。
移除元素：center, font, strike。
異常處理
HTML5 (text/html) 瀏覽器將在錯誤語法的處理上更加靈活。HTML5 在設計時保證舊的瀏覽器能夠安全的忽略掉新的HTML5代碼。與HTML4.01相比，HTML5 給出了解析的詳細規則，力圖讓不同的瀏覽器即使在發生語法錯誤時也能返回相同的結果。
『貳』 請教前輩，什麼是HTML5啊要有什麼基礎嗎
1，什麼是HTML5
HTML5是HTML下一個主要的修訂版本，現在仍處於發展階段。目標是取代1999年所制定的HTML 4.01和XHTML 1.0 標准，以期能在互聯網應用迅速發展的時候，使網路標准達到符合當代的網路需求。廣義論及HTML5時，實際指的是包括HTML、CSS和JavaScript在內的一套技術組合。它希望能夠減少瀏覽器對於需要插件的豐富性網路應用服務（plug-in-based rich internet application，RIA)，如Adobe Flash、Microsoft Silverlight，與Oracle JavaFX的需求，並且提供更多能有效增強網路應用的標准集。
學到話主要是學html標記語言，css，js，canvas，dom以及特效實現等具體的話你可以看下【itch培訓】，他們有專門的h5課程。
2，要有什麼基礎
html5就是學習更多網路知識的基礎
最好不要把html5當成一種技術來學習，把它作為工具
html5涉及的領域很多，包括seo，javascript，css，xml，離線資料庫等等
學習html5本身很簡單但是深入學習其他技術才更重要
『叄』 用哪種離線資料庫實現離線緩存比較好
端可以使用資料庫，但是不使用資料庫的方案通常也同樣是最好、最恰當的方案。例如 Html5 標準的 localStorage 等，桌面端你可以序列化、反序列化內部對象，並且每隔幾分鍾就保存一次。等等。
在現在這個互聯網、4G條件下，實際上聯網是一個標准化的東西，不聯網才是不標准化的。15年前根本沒法比。而有些人的思維方式可能還是15年前的。
『肆』 html5 的「本地存儲」有什麼作用，是用在什麼地方的，還有。離線應用程序，都是用來做什麼的！啊啊啊！！
html5的本地存儲 就是一個輕量級的sqllite資料庫
離線應用 是ApplicationCache 用於在斷開網路連接的情況下 讀取本地緩存
瀏覽器緩存 不安全
本地緩存 可以指定緩存頁面 及文件
『伍』 html5 的離線儲存方式有哪些
localStorage - 永久存儲
sessionStorage -關閉頁面消失
還可以創建本地資料庫 -沒研究過
『陸』 離線操作資料庫的流程有哪些
摘要 公司快速發展人員增加，因IT問題無法專注核心業務，糟糕的網路環境更是降低員工工作效率。選擇上海蘆洲應急服務，專職工程師3分鍾響應、2小時內到場服務。
『柒』 HTML5怎麼連接資料庫
HTML5屬於前端，連接資料庫的話需要一門後端語言，比如PHP，java一類。你可以用java去連接資料庫。html5其實是html的一個版本，只不過在國內被擴大了范圍，變成了html
+
css
+
javascript。資料庫跟html5就像頭與腿的關系，2者之間還隔著個身體（java,php,node等）
『捌』 html5的優點
HTML5為什麼如此受歡迎？主要因為它本身的優勢。HTML5的主要優勢如下：
1、基於HTML5強大的兼容性。因為HTML5提供了前所未有的數據與應用接入開放介面，使外部應用可以直接與瀏覽器內部的數據直接相連，例如視頻影音可直接與microphones及攝像頭相聯，就因為這種強大的兼容性，使得在當下開發界是如此的火，同樣也是因為這強大的兼容性，使得手機應用軟體，app更適合，也更方便。所以更適合手機app軟體開發，正好補充了手機小巧的不足。
2、HTML5開發支持的手機系統有android、ios。
3、HTML5其突出的特點就是強化了web頁的表現性,追加了本地資料庫，可以用作離線應用的開發，離線應用就是把需要的資源先緩存到本地，下次再查看時無需聯網。
4、HTML5開發能提供更快、更簡便的服務，代碼可高度重用，服務發布方便。
5、動畫、游戲動態效果，地理定位等很多app應用正在崛起，而HTML5技術的強大優勢就是這種讓我們驚嘆的效果。而未來採用HTML5開發app的，將會大量減少代碼量，應用軟體也會得到更高的用戶體驗，更好的視覺效果。
『玖』 HTML5 Web SQL 資料庫怎樣實現多表查詢
HTML5的Web SQL Databases（html5 本地資料庫）的確很誘惑人，當你發現可以用與mysql查詢一樣的查詢語句來操作本地資料庫時，你會發現這東西挺有趣的。今天，我們一起來了解HTML 5的Web SQL Database API:openDatabase、transaction、executeSql。
Web SQL資料庫API實際上不是HTML5規范的組成部分，而是單獨的規范。它通過一套API來操縱客戶端的資料庫。Safari、Chrome、Firefox、Opera等主流瀏覽器都已經支持Web SQL Database。HTML5的Web SQL Databases的確很誘惑人，當你發現可以用與mysql查詢一樣的查詢語句來操作本地資料庫時，你會發現這東西挺有趣的。今天，我們一起來了解HTML 5的Web SQL Database API。
下面將一一將介紹怎樣創建打開資料庫，創建表，添加數據，更新數據，刪除數據，刪除表 。
先介紹三個核心方法
1、openDatabase：這個方法使用現有資料庫或創建新資料庫創建資料庫對象。
2、transaction：這個方法允許我們根據情況控制事務提交或回滾。
3、executeSql：這個方法用於執行真實的SQL查詢。
第一步：打開連接並創建資料庫
代碼如下:
var dataBase = openDatabase("student", "1.0", "學生表", 1024 * 1024, function () { });
if (!dataBase) {
alert("資料庫創建失敗！");
} else {
alert("資料庫創建成功！");
}
解釋一下openDatabase方法打開一個已經存在的資料庫，如果資料庫不存在，它還可以創建資料庫。幾個參數意義分別是：
1，資料庫名稱。
2，版本號 目前為1.0,不管他，寫死就OK。
3，對資料庫的描述。
4，設置數據的大小。
5，回調函數(可省略)。
初次調用時創建資料庫，以後就是建立連接了。
創建的資料庫就存在本地，路徑如下：
C:\Users\Administrator\AppData\Local\Google\Chrome\User Data\Default\databases\http_localhost_4987 。
創建的是一個sqllite資料庫，可以用SQLiteSpy打開文件，可以看到裡面的數據。SQLiteSpy是一個綠色軟體，可以網路一下下載地址或SQLiteSpy官方下載：SQLiteSpy。
第二步：創建數據表
代碼如下:
this.createTable=function() {
dataBase.transaction( function(tx) {
tx.executeSql(
"create table if not exists stu (id REAL UNIQUE, name TEXT)",
[],
function(tx,result){ alert('創建stu表成功'); },
function(tx, error){ alert('創建stu表失敗:' + error.message);
});
});
}
解釋一下，
executeSql函數有四個參數，其意義分別是：
1）表示查詢的字元串，使用的SQL語言是SQLite 3.6.19。
2）插入到查詢中問號所在處的字元串數據。
3）成功時執行的回調函數。返回兩個參數：tx和執行的結果。
4）一個失敗時執行的回調函數。返回兩個參數：tx和失敗的錯誤信息。
第三步：執行增刪改查
1）添加數據：
代碼如下:
this.insert = function () {
dataBase.transaction(function (tx) {
tx.executeSql(
"insert into stu (id, name) values(?, ?)",
[id, '徐明祥'],
function () { alert('添加數據成功'); },
function (tx, error) { alert('添加數據失敗: ' + error.message);
} );
});
2）查詢數據
代碼如下:
this.query = function () {
dataBase.transaction(function (tx) {
tx.executeSql(
"select * from stu", [],
function (tx, result) { //執行成功的回調函數
//在這里對result 做你想要做的事情吧...........
},
function (tx, error) {
alert('查詢失敗: ' + error.message);
} );
});
}
解釋一下
上面代碼中執行成功的回調函數有一參數result。
result：查詢出來的數據集。其數據類型為 SQLResultSet ，就如同C#中的DataTable。
SQLResultSet 的定義為：
代碼如下:
interface SQLResultSet {
readonly attribute long insertId;
readonly attribute long rowsAffected;
readonly attribute SQLResultSetRowList rows;
};
其中最重要的屬性—SQLResultSetRowList 類型的 rows 是數據集的「行」 。
rows 有兩個屬性：length、item 。
故，獲取查詢結果的某一行某一列的值 ：result.rows[i].item[fieldname] 。
3）更新數據
代碼如下:
this.update = function (id, name) {
dataBase.transaction(function (tx) {
tx.executeSql(
"update stu set name = ? where id= ?",
[name, id],
function (tx, result) {
},
function (tx, error) {
alert('更新失敗: ' + error.message);
});
});
}
4）刪除數據
代碼如下:
this.del = function (id) {
dataBase.transaction(function (tx) {
tx.executeSql(
"delete from stu where id= ?",
[id],
function (tx, result) {
},
function (tx, error) {
alert('刪除失敗: ' + error.message);
});
});
}
5）刪除數據表
代碼如下:
this.dropTable = function () {
dataBase.transaction(function (tx) {
tx.executeSql('drop table stu');
});
}