搞定Html5基本語法及詳解

　　在HTML5中，有不少新的富含語義的元素，可以向瀏覽器和開發(fā)人員傳達元素的用途。在做Html5開發(fā)時開發(fā)工具有很多：dw,sublime,Editplus...這里推薦用sublime因為界面比較整潔，提示比較清晰，是專屬的文本開發(fā)工具。

　　下面是HTML5的一部分新的布局元素：

　　article

　　aside

　　figcaption

　　figure

　　footer

　　header

　　hgroup

　　mark

　　nav

　　section

　　time

　　header和footer的作用不言自明，article是創(chuàng)建一塊文章區(qū)域，aside和section是創(chuàng)建一塊區(qū)域，aside元素用來安置附帶的內(nèi)容，nav將創(chuàng)造一個導航條或者菜單條。用mark元素將重要文本高亮顯示或標記出來，如果要在內(nèi)容中插入一張圖(圖像、圖表、照片和代碼片段等)，可以使用figure(它與布局無關(guān)，可以去/留)元素，figcaption元素能為圖加上標題;time可以專門用來存放時間。例：

　　Article#1

　　Thisisthefirstarticle.Thisishighlighted.

　　Article#2

　　Thisisthesecondarticle.Thesearticlescouldbeblogposts,etc.

　　智能表單設(shè)計：

　　Html5的優(yōu)點體現(xiàn)在表單設(shè)計客戶端校驗上，能避免繁瑣的js操作：

　　—比如自動校驗輸入的是否為email:

　　E-mail:

　　—輸入數(shù)字范圍限定：

　　point:

　　—選擇一個范圍內(nèi)的數(shù)字：

　　——時間選擇Inputtype—DataPickers，時間選擇避免了大量的js腳本

　　-date:selectsdate，monthandyear

　　-month:selectsmonthandyear

　　-week:selectsweekandyear

　　-time:selectstime(hourandminute)

　　-datetime:selectstime，date,month,andyear(UTCtime)

　　-datetime—local:selectstime,date,monthandyear(localtime)

　　color:

　　這個效果沒有展示出來，應(yīng)該是瀏覽器不支持，注意選擇瀏覽器上述幾個效果都可以。

　　Form的新屬性：

　　—Autofocus

　　頁面加載后自動獲得焦點。

　　—placeholder可指定文本框的顯示形式

　　E-mail:

　　——required,當頁面失去焦點時，提示此處為必填項

　　還有些新的屬性：

　　顯示圖標界面也是Html5的一大亮點：如meter可以顯示進度，progress可以顯示進度條

　　最后想要工作不累就要不斷的提升自己的技能，想要快速學習HTML5開發(fā)就到由專業(yè)老師授課的扣丁學堂學習吧。扣丁學堂還有名師錄制的HTML5視頻教程供學員觀看學習，想要HTML5視頻教程的小伙伴快咨詢我們的專業(yè)老師索要吧?？鄱W堂H5技術(shù)交流群：751662650。