今天打開博客看到自己有了一個小粉絲，說實話還是蠻開心的，堅持寫博客大半年了，終於迎來了自己的第一個小伙伴。總算是堅持了那么久的事情看到了結果吧。
前幾天參加了我們學院老師的比賽---《青年教師大賽的初賽》。我被我們老師拉去做了義工-----計時員。看了所有老師的比賽，雖然都特別好，但是讓我印象深刻的還是一個HTMl5+CSS3的課程。看到那種炫酷的效果，我瞬間都被吸引住了。所以忙完了手頭上的作業，就從別人那里要到了HTML5的教程，開始了我的學習HTML5之路。雖然看了6節課了，還是沒有學到老師演示的那種效果，但是在這六節課當中確實是感受到了HTML5的魅力所在，大大減少了代碼量，不僅如此，以前繁瑣的效果都能輕而易舉的實現。而且還可以自適應屏幕，如果真的掌握了這門技術，我的android開發也會受益很多吧。
-
結構元素
header元素
html5中的header元素是一種具有引導和導航作用的結構元素，該元素可以包含所有放在頁面頭部的內容。Header元素通常來放置整個頁面或頁面內的一個內容區塊的標題，也可以包含網站的logo圖片，搜索表單后者其他相關內容。其基本語法格式為：
<header>
<h1> 網頁主題</h1>
......
</header>
Exp01.html
注意：header元素並非head元素，在html網頁中，並不限制header元素的個數，一個網頁中可以使用多個header元素，也可以為每一個內容塊添加header元素。
Article元素
Article元素代表文檔、頁面或者應用程序中與上下文不相關的獨立部分。該元素經常被用於定義一篇日志、一條新聞、或者用戶評論等。Article元素經常使用多個section元素進行划分，一個頁面中的article元素可以出現多次。
Exp02.html
Time元素
Time元素用於定義時間或日期，可以代表24小時中的某一時間。Time不會在瀏覽器中呈現任何特殊效果，但是該元素能以機器可讀的方式對日期和時間進行編碼，這樣，用戶能夠將生日提醒或其他事件添加到日程表中，搜索引擎也能夠生成更智能的搜索結果。
Time元素有兩個屬性：
Datetime：用於定義相應的時間或日期。取值為具體時間（如14:00）或具體日期（如：2015-09-01）,不定義該屬性時，由元素的內容給定日期/時間。
Pubdate:用於定義time元素中的日期/時間是文檔（或article元素）的發布日期。取值一般為“pubdate”。
Exp03.html
Address元素
Exp05.html
Footer元素
Footer元素用於定義一個頁面或者區域的底部，它可以包含所有通常放在頁面底部的內容。在html5出現之前，一般使用<div id=”footer”></div>標記來定義頁面的底部，而通過html5的footer元素輕松實現。
與header元素相同，一個頁面中可以包含多個footer元素。同時，也可以在article元素或者section元素中添加footer元素。
Exp06.html
Nav元素
Nav元素用於定義導航鏈接，是html5新增的元素，該元素可以具有導航性質的鏈接歸納在一個區域中，使頁面元素的語義更加明確。其中的導航元素可以鏈接到站點的其他頁面，或者當前頁的其他部分。
Exp07.html
在上面的這段代碼中，通過在nav元素內部嵌套無序列表ul來搭建導航結構。通常，一個html頁面中可以包含多個nav元素，作為頁面整體或不同部分的導航。具體來說，nav元素可以用於以下幾種場合。
傳統導航條：目前主流網站上都有不同層級的導航條，其作用是跳轉到網站的其他主頁面。
側邊欄導航：目前主流博客網站及電商網站都有側邊欄導航，目的是將當前文章或當前商品頁面跳轉到其他文章或其他商品頁面。
頁內導航：它的作用是在本頁面幾個主要的組成部分之間進行跳轉。
翻頁操作:翻頁操作切換的是在本網頁的內容部分，可以通過單擊“上一頁”或“下一頁”切換，也可以通過單擊實際的頁數跳轉到某一頁。
除了以上幾點以外，nav元素也可以用於其它重要的、基本的導航鏈接組中。
需要注意的是，並不是所有的鏈接組都要被放進nav元素，只需要將主要的和基本的鏈接放進nav元素即可。
Aside元素
Aside元素用來定義當前頁面或者文章的附屬信息部分，它可以包含與當前頁面或主要內容相關的引用、側邊欄、廣告、導航條等其他類似的有別於主要內容的部分。
Aside元素的用法主要分為兩種：
被包含在article元素內作為主要內容的附屬信息。
在article元素之外使用，作為頁面或站點全局的附屬信息部分。最常用的使用形式是側邊欄，其中內容可以是友情鏈接。廣告單元等。
Exp08.html
第一個aside元素位於article元素中，用於添加文章的其他相關信息，第2個aside元素用於存放頁面的側邊欄內容
Section元素
Section元素用於對網站或應用程序中頁面上的內容進行分塊，一個section元素通常由內容和標題組成。在使用section元素時，需要注意以下3點。
不要將section元素用作設置樣式的頁面容器，那是div的特性。Section元素並非一個普通的容器元素，當一個容器需要被直接定義樣式或通過腳本定義行為時，推薦使用div。
如果article元素、aside元素或nav元素更符合條件，那么不要使用section元素。
沒有標題的內容區塊不要使用section元素定義。
Exp09.html
Header元素是用來定義文章的標題，section元素是用來存放對小張的評論內容，article元素是用來划分section元素所定義的內容，將其划分為兩部分。
分組元素
分組元素用於對頁面中的內容進行分組。Html5中涉及的3個與分組相關的元素，分別是figure元素、figcaption元素和hgroup元素。
Hgroup元素
Hgroup元素用於將多個標題（主標題和副標題或者子標題）組成一個標題組，通常它與h1-h6元素組合使用。通常，將hgroup元素放在header元素中。
在使用hgroup元素時要注意以下幾點。
如果只有一個標題元素不建議使用hgroup元素。
當出現一個或者多個以上的標題與元素時，推薦使用hgroup元素作為標題元素。
當一個標題包含副標題、section或者article元素時，建議將hgroup元素和標題相關的元素放到header元素容器中。
Exp04.html
為了更好的演示說明各個群組的功能，hgroup元素通常與figcaption結合使用。
下面一個案例演示：
Figure元素
在html5中，figure元素常用於定義獨立的內容（圖像、圖表、照片、代碼等），一般指一個單獨的單元。Figure元素的內容應該與主內容相關，但如果被刪除，也不會對文檔流產生影響。Figcaption元素常用於為figure元素組添加標題，一個figure元素內最多允許使用一個figcaption元素，該元素應該放在figure元素的第一個或者最后一個子元素的位置。
Exp10.html
表單類型之新的類型的輸入類型
Meter元素
Meter元素用於表示指定范圍內的數值。例如，顯示硬盤容量或者對某個候選者的投票人數占總投票人數的比例等，都可以使用meter元素。
| 屬性 |
說明 |
| High |
定義度量的值位於哪個點被界定為高的值 |
| Low |
定義度量的值位於哪個點被界定為低的值 |
| Max |
定義最大的值，默認值是1 |
| Min |
定義最大的值，默認值是0 |
| Optimum |
定義什么樣的度量值是最佳的值。如果該值高於high值，則意味着值越高越好。如果該值低於low屬性的值，則意味着值越低越好 |
| Value |
定義度量的值 |
Progress元素
Progress元素用於表示一個任務的完成進度。這個進度可以是不確定的，只是表示進度正在進行，但是不清楚還有多少的工作量沒有完成。也可以用0到某個最大數字（如100）之間的數字來表示准確的進度完成情況（如進度百分比）
Progress元素的常用屬性值有兩個。
Value：已經完成的工作量。
Max：總共有多少個工作量。
需要注意的是value和max屬性的值必須大於0，且value的值要小於等於max屬性的值。
Exp10.html
視頻屬性：
