22個HTML5 技巧 HTML學習

html5 技巧一：1. 新的文件型別（doctype）

上面這個既麻煩又難記的xhtml文件型別你還在使用嗎？如果還是這樣的話，現在該切換到新的html5文件型別了。

現在只要這麼簡單的15個字元就可以了。（注意：你的doctype的申明需要出現在你html檔案的第一行。）

2. 圖形（figure）元素

你還在考慮用下面的**來標記嗎？

image of mars.

上面的**它不能以簡單而且富有語義關聯的方式與圖形的標題關聯，因為它僅僅是用段落標記以及元素包裹，而 html5通過引進元素，改進了這一點。當結合元素使用時，我們就可以將圖形標題與圖形配對起來。**如下：

this is an image of something interesting.

3. 重新定義

4. 不再需要指令碼、鏈結型別

很可能你仍然像下面的**一樣給你的鏈結和指令碼標籤新增型別的屬性。

在html5中，這已經不再需要了。意味著說這兩個標籤分別代表著樣式和指令碼。因此，我們可以將它們的型別屬性都刪除掉。**如下：

5. 使用還是不使用引號

記住，html5與xhtml不同，如果你不喜歡的話你不必用引號將屬性包裹起來。不過，要是你覺得用引號會讓你覺得更加舒服的話，當然也不會有任何問題。

start the reactor.

6. 使你的內容可編輯

html5其中乙個非常強大的功能就是"contenteditable"，顧名思義它將允許使用者編輯元素（包括他的子元素）內包含的任何文字內容。它的用途非常廣，如，簡單的任務清單或是基於wiki的站點也非常實用，此外，它還有乙個優勢就是利用了本地的儲存。

或者，按照第五條技巧所說的，你也可以將第九行的**寫成這樣（不用引號）：

7. 電子郵件輸入

如果我們應用"電子郵件"型別來指定輸入的形式，我們可以命令瀏覽器只允許符合有效電子郵件位址結構的字串輸入。雖然說內建的表單驗證很快就會到來，但是我們也不能完全依靠這個。比較舊的瀏覽器不理解這種"電子郵件"型別，它們只會簡單地返回到普通的文字框。

在說到瀏覽器所支援和不支援的元素以及屬性時，你必需知道當前所有瀏覽器都不是那麼可靠。例如，opera只有在你指定name屬性時才支援電子郵件驗證。不過，它不支援佔位符屬性（下面即將要講到的）。最後，雖然你可以使用這種形式的驗證，不過不要過分依賴它。