1. 什麼是HTML5 網頁的5.0版本。2014年才定製完HTML5的標準，歷時8年 2. 為什麼要用HTML5 1> 跨平臺：利用HTML5編寫的UI界面能運行在所有擁有瀏覽器的平臺 2> HTML5的運行平臺：瀏覽器 3> 但是HTML5不能完成一些特定的功能，比如：拍照(ImagePicke ...
1. 什麼是HTML5
網頁的5.0版本。2014年才定製完HTML5的標準，歷時8年
2. 為什麼要用HTML5
1> 跨平臺：利用HTML5編寫的UI界面能運行在所有擁有瀏覽器的平臺
2> HTML5的運行平臺：瀏覽器
3> 但是HTML5不能完成一些特定的功能，比如：拍照(ImagePickerController)、訪問相冊....
3. 如何使用HTML5
1> 自己編寫大量的HTML5代碼
2> 使用現成的HTML5框架
sencha-touch
phoneGap
jQuery mobile
bootstrap
4. 手機APP的開發模式
1> 原生（純OC）
2> 純HTML5
3> 原生+HTML5
5. 為什麼要學習HTML5
1> 未來的一種趨勢
2> 增加面試、開發競爭力
Android程式員 Java、伺服器、HTML5
6. 公司職位的劃分
1> 平面設計師 作圖、切圖、HTML、CSS
2> 前端工程師 HTML、CSS、Javascript、模板技術
3> 後臺工程師 伺服器（Java、.Net、PHP）、資料庫
4> 移動工程師（iOS/android）手機UI界面（OC、HTML5）、跟伺服器交互
7. Web開發新時代
Web1.0
主流技術：HTML+CSS
Web2.0
主流技術：Ajax(JavaScript/DOM/非同步數據請求)
Web3.0
主流技術：HTML5+CSS3
HTML5亮點：Canvas、HTML5音視頻、Web存儲、Geolocation、Workers多線程處理
CSS3亮點：設計動畫、2D變形、N多新特性
8. 網頁的組成
一個有具體功能的完整的網頁，一般由3部分組成
1》HTML：網頁的具體內容和結構
2》CSS：網頁的樣式（美化網頁最重要的一塊）
3》JavaScript(掌握)：網頁的交互效果，比如對用戶滑鼠事件做出響應
HTML \ CSS \ JavaScript 學習資料：http://www.w3school.com.cn/
9. HTML
什麼是HTML：HTML的全稱是HyperText Markup Language，超文本標記語言
其實它就是文本，由瀏覽器負責將它解析成具體的網頁內容。
10. HTML的組成
跟XML類似，HTML由N個標簽（節點、元素、標記）組成
HTML語法非常鬆散，目前的最新版是5.0，也就是HTML 5
11. 常見的HTML標簽
- 標題：h1、h2、h3、h4、h5....
- 段落：p
- 換行：br
- 容器：div、span（用來容納其他標簽）
- 表格：table、tr、td
- 列表：ul、ol、li
- 圖片：img
- 表單：input
- 鏈接：a
12. HTML5新增標簽
HTML5新增了27個標簽元素，廢棄了16個標簽元素，主要包括：結構性標簽、級塊性標簽、行內語義性標簽、交互性標簽
1》結構性標簽
負責Web上下文結構的定義，確保HTML文檔，包括：
article 文章主體內容(一篇博客、一篇論壇帖子、一段用戶評論、插件)
header 標記頭部區域內容（文章的頭部）
footer 標記腳部區域內容（文章的底部）
section 區域章節表述 （文章的區域章節）
nav 菜單導航，鏈接導航
2》塊級性標簽（分塊用的）
完成Web頁面區域的劃分，確保內容的有效分隔，包括：
aside 註記,貼士,側欄,摘要,插入的引用作為補充主體的內容
figure 對多個元素組合併展示的元素,常與figcaption聯合使用
code 表示一段代碼塊
dialog 人與人之間對話,包含dt和dd兩個組合元素（dt用於表示說話者、dd用於表示說話者的內容）
3》行內語義性標簽
完成Web頁面具體內容的引用和表述，豐富展示內容，包括：
meter 特定範圍內的數值，如工資、數量、百分比
time 時間值
progress 進度條，可用max、min、step進行控制，完成對進度的表示和監聽
video 視頻元素，用於視頻播放，支持緩衝預載和多種視頻媒體格式
<!--視頻播放-->
// 告訴瀏覽器，我要使用你的播放器 controls
<video src="source/BigBuck.m4v" controls="controls"></video>
audio 音頻元素，用於音頻播放，支持緩衝預載和多種音頻媒體格式
<!--音頻播放-->
// 告訴瀏覽器，我要使用你的播放器 controls
<audio src="source/music.m4a" controls="controls"></audio>
4》交互性標簽
功能性內容的表達，有一定的內容和數據的關聯，是各種事件的基礎，包括：
details 表示一段具體的內容，預設不顯示，通過某種方式（單擊）與legend交互才會顯示
datagrid 控制客戶端數據與顯示，可用於動態腳本及時更新
menu 用於交互菜單
command 用來處理命令按鈕
13. HTML標簽類型
- HTML有N多標簽，根據顯示的類型，主要可以分為3大類
1》塊級標簽
獨占一行的標簽
能隨時設置寬度和高度（比如：div、p、h1、h2、ul、li）
2》行內標簽（內聯標簽）
多個行內標簽能同時顯示在一行
寬度和高度取決於內容的尺寸（比如：span、a、label）
3》行內-塊級標簽（內聯-塊級標簽）
多個行內-塊級標簽可以顯示在同一行
能隨時設置寬度和高度（比如：input、button）
div與span標簽的區別：
div標簽是塊級標簽，獨占一行，可以設置寬度和高度。
span標簽是行內標簽：多個行內標簽可以同時顯示在一行，寬度和高度取決於內容的大小。
14. 修改標簽的顯示類型
CSS中有個display屬性，能修改標簽的顯示類型
1》none：隱藏標簽
div {
color: red;
<!--隱藏標簽（包括標簽的結構和內容）-->
display: none;
}
2》block：讓標簽變為塊級標簽
span {
background-color: yellow;
/* 把當前標簽變為塊級標簽（就可以獨占一行和設置標簽的寬高）*/
display: block;
}
3》inline：讓標簽變為行內標簽
div {
background-color: red;
/* 把當前標簽變為行內標簽 */
display: inline;
}
4》inline-block：讓標簽變為行內-塊級標簽（內聯-塊級標簽）
div {
background-color: red;
/*把當前標簽變為行內塊級標簽*/
display: inline-block;
}
