來了來了，總算來了，新一個系列的連載，是：《HTML5開發》。想必部分期待reactjs和nodejs的同學會失望，但是，前端君怎么舍得讓你難過。這次選擇HTML5，只是順序的問題。熱門的知識，我們一個都不會落下，都把它們學了。

跟其他地方的教程一樣，第一節一般都是講HTML5的簡介。但跟其他教程不一樣的是，我們不用文縐縐的專業詞匯來介紹，那樣會毫無趣味。前端君會用著幾年來HTML5使用感受和對互聯網的觀察來跟童鞋們聊聊HTML5。（接下來的學習，前端君默認大家已經了解了什么是HTML以及相關的概念）

HTML5的誕生背景

在HTML5誕生之前，我們使用的是HTML4.01，在此之前，還有更早的HTML3.2，HTML2.0等等，在往上追溯，有的同學可能會發現HTML的年齡比我們還大。

HTML每推出一個新版本，都是為了順應互聯網的發展趨勢，更好地滿足用戶的使用行為。以前利用網絡最多的就是看新聞，發郵件，還有網頁3G QQ。（看到下圖，滿滿的回憶）

( ?玩過3G QQ的舉手 )

再看看現在，用戶用手機網頁看視頻、聽音樂、玩游戲、看web前端教程公眾號（這廣告打得，是不是有點措手不及），早已不是什么新鮮事，也早已習慣朋友圈滿屏各種的酷炫的、搞笑的、溫馨的、逗逼的H5廣告。

?

隨著網絡的普及和設備性能的增強，僅僅幾年時間，用戶的上網行為早已天翻地覆，與之伴隨的則是技術的更新和進步，HTML5在這樣的趨勢下應運而生，它的出現把互聯網技術的發展推進了一個新的時代。

?

HTML5的現狀

2014年10月底，HTML5規范正式定稿的時候，當時鋪天蓋地的文章都在說HTML5將要顛覆APP開發，HTML5的優勢被無限放大，更有人預計說要取代原生開發模式，然而，兩年過去了，這..............并沒有發生，并沒有，沒有。

就目前來看，HTML5的適用場景更多的是：

1.???手機移動官網（如：淘寶手機網站等）

2.????與原生app開發結合（如：嵌在微信里的京東商城，還有你現在看的公眾號文章）

3.????營銷應用（如：企業的H5招聘廣告）

4.????HTML5游戲（如：神經貓游戲）

所以，不要再吹噓什么HTML5取代原生app開發了，至少現在看來是不可能，或者說兩者并不是完全對立關系，它們是可以共存的、互補的。

至于HTML5未來我們沒必要去預測，至少現在HTML5開發已經成為每一個web前端開發者必備的技能，甚至也有企業把HTML5開發獨立成一個崗位進行招聘，可見它的重要性和火熱程度。

HTML5的新特性

竟然HTML5這么火熱，這么受歡迎，肯定有它受歡迎的地方，我們來看看它都有哪些有趣的新特性，也是我們在后面章節要好好學習的知識點：

1.????canvas繪畫元素

2.????播放視頻的video元素

3.????播放音樂的audio元素

4.????Web SQL DB本地數據庫

5.????IndexedDB本地儲存

6. ? History 不刷新也可以跳轉頁面

7. ? 全新的表單控件data，week，time等

還有更多很好玩、很實用的特性，我們不急著一一列舉，后面的章節會學習。

?

?好玩的CSS3?

CSS 是用于控制網頁的樣式和布局。既然講到HTML5，就少不了CSS3，它們經常會被結合使用來實現想要的效果。

以前要實現一個動畫效果，我們可能會采取JavaScript的輔助，編寫大量的代碼。現在，有了CSS3的出現，我們實現動畫效果，3D效果變得更加簡單。

前端君利用CSS3來實現一個簡單的3D動畫效果：

（此圖是gif動畫圖，加載需要點時間）

以上的效果，僅僅需要幾行簡單的CSS3代碼即可實現，是不是有點小激動，掌握了CSS3的知識，你也可以根據自己想法，來實現各種炫酷效果。是不是很想學？那就對了，跟著前端君的這次《HTML5開發》系列連載，包你學會！

本節小結?

總結：HTML5的誕生是順應了技術進步的發展，更好地滿足如今用戶的上網行為。在如今的互聯網有著很廣泛的使用，與原生APP開發模式并存互補。它給開發者帶來很多有趣的新特性，CSS3為實現各種網頁效果提供了更簡便的方式。

總結

以上是生活随笔為你收集整理的第一节：别出心裁的HTML5简介的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。