tml5學(xué)習(xí)方法之技能清單：

必須掌握基本的Web前端開(kāi)收技術(shù)，其中包括：CSS、HTML、DOM、java、Ajax，jquery，Vue，jquery- mobile，zepto等，在掌握這些技術(shù)的同時(shí)，還要清楚地了解它們?cè)诓煌瑸g覽器上的兼容情況、渲染原理和存在的Bug。這是前端工程師的最核心技能，是專做頁(yè)面效果的技術(shù)。

更深等級(jí)需要學(xué)習(xí)和了解更多的東西，比如一些熱門的框架backbone，angularjs 等;nodejs近幾年也越來(lái)越水了，同樣需要學(xué)習(xí)。

學(xué)習(xí)HTML5的具體方法匯總

方法1 整體到局部，骨架到血肉

在學(xué)習(xí)HTML和CSS時(shí)，會(huì)涉及到網(wǎng)頁(yè)的搭建。學(xué)習(xí)這個(gè)知識(shí)時(shí)，我們采用的方法是“由外及內(nèi)”，“由全局到細(xì)節(jié)”。 從主干到枝葉，而不要陷入細(xì)節(jié)，糾結(jié)于其中。主干如同知識(shí)的一個(gè)主線，這種先找主干后添枝葉的學(xué)習(xí)方法能夠讓知識(shí)遺漏變成最少，也會(huì)比較容易建立起知識(shí)體系。

方法2 ：類比

在學(xué)習(xí)CSS引入方式這種知識(shí)點(diǎn)時(shí)，我們采用類比。

這種方法主要針對(duì)于區(qū)分相似的兩種或多種事物。如strong與em，塊元素與行元素，同步與異步。

抓取幾種事物的不同點(diǎn)，結(jié)合去記憶。

方法3 ：記憶很重要

學(xué)習(xí)時(shí)會(huì)遇到一些知識(shí)點(diǎn)，數(shù)據(jù)類型，標(biāo)簽元素，記下來(lái)很必要。如果連記都記不住，還談什么理解？技術(shù)不是數(shù)學(xué)方程式，學(xué)會(huì)方法重要，但是記憶也很重要。

方法4： 循序漸進(jìn)

遇到比較難啃的知識(shí)，一步一步來(lái)，循序漸進(jìn)。動(dòng)畫框架的學(xué)習(xí)就是一個(gè)典型。

在循序漸進(jìn)中，思路很重要，想清楚從哪里下口，如何一口一口吃掉這個(gè)東西。關(guān)注思路和流程，跟第一點(diǎn)中的主干和枝干一樣，分清主次，決定吃的順序。

方法5： 知識(shí)的遷移

用已有知識(shí)輔助未知知識(shí)的學(xué)習(xí)，是很好的一種方法。通常這種方法應(yīng)用于擁有相似特點(diǎn)的事物。例如：圓角邊框與外邊距、背景切割與背景原點(diǎn)、JS對(duì)象與JSON等

方法:6 生活輔助學(xué)習(xí)

在講解盒模型時(shí)可以用快遞中的方魚缸。在講解AJAX時(shí)可以用信件郵寄。在講解構(gòu)造函數(shù)時(shí)，我們可以用毛坯房和裝修房。在講解引用類型變量的時(shí)候可以用鑰匙和倉(cāng)庫(kù)的關(guān)系。

技術(shù)很難，但生活并不難。

方法7： 實(shí)踐:是檢驗(yàn)真理的唯一標(biāo)準(zhǔn)

聽(tīng)的再認(rèn)真，學(xué)的再透徹，自己碼代碼是還是會(huì)碰到各種問(wèn)題。紙上得來(lái)終覺(jué)淺，絕知此事要躬行。

學(xué)習(xí)萬(wàn)般技巧均在一個(gè)字里，做。

TML5帶來(lái)的新特色

1.用于繪畫的 canvas 元素

2.用于媒介回放的 video 和 audio 元素

3.對(duì)本地離線存儲(chǔ)的更好的支持

4.新的特殊內(nèi)容元素，比如 article、footer、header、nav、section

5.新的表單控件，比如 calendar、date、time、email、url、search

本次分享：

1.常用的新增語(yǔ)義標(biāo)簽

2.Input控件類型

3.常用的html5標(biāo)簽

這張圖片你應(yīng)該很熟悉：

比較常用的HTML5語(yǔ)義標(biāo)簽總結(jié)：

1.<header> : 用于規(guī)定文檔頭部或者內(nèi)容的展示，在文檔中你可以使用多個(gè)header標(biāo)簽

2.<nav> : 用于定義導(dǎo)航鏈接部分

3.<section> : 標(biāo)簽定義文檔中的節(jié)（section、區(qū)段）。比如章節(jié)、頁(yè)眉、頁(yè)腳或文檔中的其他部分

4.<article> : 標(biāo)簽定義獨(dú)立的內(nèi)容

5.<aside> : 標(biāo)簽定義頁(yè)面主區(qū)域內(nèi)容之外的內(nèi)容（比如側(cè)邊欄）。標(biāo)簽的內(nèi)容應(yīng)與主區(qū)域的內(nèi)容相關(guān)

6. <footer>: 元素描述了文檔的底部區(qū)域。例如：作者，著作權(quán)信息，鏈接的使用條款，聯(lián)系信息等

常用的HTML5新標(biāo)簽及其用法總結(jié)：

1.<b> : 定義粗體字

2.<base> : 標(biāo)簽為頁(yè)面上的所有鏈接規(guī)定默認(rèn)地址或默認(rèn)目標(biāo)。(必須插在head標(biāo)簽內(nèi))

3.<ado> : 改變文本默認(rèn)方向，屬性dir 值有兩個(gè)：ltr,rtl,意思是從左到右，從右到左

4.<center> : 對(duì)其所包括的文本進(jìn)行水平居中

5.<caption> : 元素定義表格標(biāo)題,必須緊隨 table 標(biāo)簽之后

6.<dl> : 定義列表 ，這個(gè)好像之前就有，不過(guò)不太常用，順便提一下

7.<figcaption> : 標(biāo)簽定義figure元素的標(biāo)題

8.<select> : 下拉選框，以前也經(jīng)常用到。

9.<progress> : 標(biāo)簽標(biāo)示任務(wù)的進(jìn)度（進(jìn)程）,也就是進(jìn)度條

11. <sup>和<sub> 文本上標(biāo)和下標(biāo)

12.<del>和<ins> ：來(lái)描述文檔中的更新和修正

13.<sumary> 和<details> :標(biāo)簽包含 details 元素的標(biāo)題，"details" 元素用于描述有關(guān)文檔或文檔片段的詳細(xì)信息。這兩個(gè)標(biāo)簽是放在一起使用的。

提出小小的學(xué)習(xí)意見(jiàn)：
學(xué)習(xí)的過(guò)程中，不要因?yàn)橛洸蛔∧承?biāo)簽或者屬性而懊惱，（好吧~，我之前有過(guò)）。后來(lái)，在不斷的學(xué)習(xí)中，我開(kāi)始認(rèn)識(shí)到理解是要放在第一位的，屬性記不住，沒(méi)關(guān)系，在這么方便的條件下，隨手一查就可以找到，所以理解和會(huì)用是最重要的。還有一點(diǎn)，不能固執(zhí)己見(jiàn)，要多關(guān)注前沿的技術(shù)，即使不太用到，多了解了解也是很好的嘛~
談生活 不談技術(shù) 談技術(shù) 不談生活 僅此而已

提出小小的學(xué)習(xí)意見(jiàn)：

學(xué)習(xí)的過(guò)程中，不要因?yàn)橛洸蛔∧承?biāo)簽或者屬性而懊惱，（好吧~，我之前有過(guò)）。后來(lái)，在不斷的學(xué)習(xí)中，我開(kāi)始認(rèn)識(shí)到理解是要放在第一位的，屬性記不住，沒(méi)關(guān)系，在這么方便的條件下，隨手一查就可以找到，所以理解和會(huì)用是最重要的。還有一點(diǎn)，不能固執(zhí)己見(jiàn)，要多關(guān)注前沿的技術(shù)，即使不太用到，多了解了解也是很好的嘛~

每天學(xué)習(xí)一點(diǎn)，進(jìn)步一點(diǎn)，一個(gè)月將會(huì)是一個(gè)質(zhì)的的飛躍，俗話說(shuō)三個(gè)臭皮匠頂一個(gè)諸葛亮，大家的智慧總是大于一個(gè)人的智慧，想要比自己牛的人交流學(xué)習(xí)，歡迎進(jìn)群：675498134，歡迎前端初學(xué)和進(jìn)階中的小伙伴。