妙用HTML5的八大特性來開發移動webAPP

第一特性：離線快取

html5 web storage api可以看做是加強版的cookie，不受資料大小限制，有更好的彈性以及架構，可以將資料寫入到本機的rom中，還可以在關閉瀏覽器後再次開啟時恢復資料，以減少網路流量。

web storage是html5引入的乙個非常重要的功能，可以在客戶端本地儲存資料，類似html4的cookie，但可實現功能要比cookie強大的多，cookie大小被限制在4kb，web storage官方建議為每個**5mb。

web storage又分為兩種：sessionstorage和localstorage

從字面意思就可以很清楚的看出來，sessionstorage將資料儲存在session中，瀏覽器關閉也就沒了；而localstorage則一直將資料儲存在客戶端本地；

不管是sessionstorage，還是localstorage，可使用的api都相同，常用的有如下幾個（以localstorage為例）：

1、儲存資料：localstorage.setitem(key,value);

2、讀取資料：localstorage.getitem(key);

3、刪除單個資料：localstorage.removeitem(key);

4、刪除所有資料：localstorage.clear();

5、得到某個索引的key：localstorage.key(index);

html5在這個方面完全不受限制，可以完全放在一起進行處理。

第三特性：地理定位

第四特性：canvas繪圖，提公升移動平台的繪圖能力

使用canvas api可以簡單繪製熱點圖收集使用者體驗資料，支援的移動、旋轉、縮放等常規編輯。而且也支援2d和3d。

第五特性：豐富的互動方式

提公升互動能力：拖拽、撤銷歷史操作、文字選擇等。比如

transition – 元件的移動效果

transform – 元件的變形效果

animation – 將移動和變形加入動畫支援

第七特性：css3 視覺設計師的輔助利器的支援。

css3支援了字型的嵌入、版面的排版，以及最令人印象深刻的動畫功能。

selector – 更有彈性的選擇器

webfonts – 嵌入式字型

layout – 多樣化的排版選擇

stlying radius gradient shadow – 圓角、漸變、陰影

border background – 邊框的背景支援

這些效果用html5實現起來是非常方便的，而如用原生開發，估計讓那些客戶端開發人員為難啦。

第八特性：html5呼叫手機攝像頭和手機相簿、通訊錄等功能

妙用html5的八大特性來開發移動webAPP

第一特性 離線快取 html5 web storage api可以看做是加強版的cookie，不受資料大小限制，有更好的彈性以及架構，可以將資料寫入到本機的rom中，還可以在關閉瀏覽器後再次開啟時恢復資料，以減少網路流量。web storage是html5引入的乙個非常重要的功能，可以在客戶端本地儲...

html5的八大特性

html5是用於取代1999年所制定的 html 4.01 和 xhtml 1.0 標準的 html 1 標準通用標記語言下的乙個應用 標準版本 現在仍處於發展階段，但大部分瀏覽器已經支援某些 html5 技術。html 5有八大特點 語義特性 class semantic html5賦予網頁更好的...

HTML5開發系列（6） 之 CSS三大特性

當同乙個標籤定義了多個樣式的時候，就存在樣式屬性衝突，樣式屬性相同則被覆蓋 當css樣式衝突的時候會執行後定義的樣式，如果樣式屬性不衝突則分開執行 我是於給div 當給父類設定相關的屬性後，子標籤會繼承父類的這些屬性顯示出來，但是不是所有的屬性樣式都是可以繼承的 可以繼承的屬性有 text font...