武林網(www.49028c.com)文章簡介:聯網科技發展的速度真可謂驚人的快,一個稍不留神,你就可能無法跟上它的步伐。HTML5的變化和更新也壓倒不少人,這篇文章將向大家介紹一些最基本也非常必要的HTML技巧。
聯網科技發展的速度真可謂驚人的快,一個稍不留神,你就可能無法跟上它的步伐。HTML5的變化和更新也壓倒不少人,這篇文章將向大家介紹一些最基本也非常必要的HTML技巧。
1. 新的文檔類型(Doctype)
你還在使用上面這個既麻煩又難記的XHTML文檔類型嗎? 如果還是這樣的話,現在該切換到新的HTML5文檔類型了。
只要這么簡單的15個字符就可以了。(注意:你的doctype的申明需要出現在你html文件的第一行。)
2. 圖形(Figure)元素
考慮用下面的代碼來標記圖片?
很不幸,它不能用簡單、富有語義關聯的方式與圖形的標題關聯,因為它僅僅是用段落標記以及圖片元素包裹著,而 HTML5通過引進<figure>元素,改進了這一點。當結合 <figcaption> 元素使用時,我們就可以將圖形標題與圖形配對起來。代碼如下:
3. 重新定義<small>
原來你可以利用<small>元素來創建與logo密切相關的副標題。不過,現在HTML5修改了這個用法,<small>元素被重新定義了,或者更恰當地說,它現在用來代表小字或其他邊注(如,網站底部的版權聲明)。
4. 不再需要腳本、鏈接類型
很可能你仍然像下面的代碼一樣給你的鏈接和腳本標簽添加類型的屬性。
在HTML5中,這已經不再需要了。 意味著說這兩個標簽分別代表著樣式和腳本。因此,我們可以將它們的類型屬性都刪除掉。代碼如下:
5. 使用還是不使用引號
記住,HTML5與XHTML不同,如果你不喜歡的話你不必用引號將屬性包裹起來。不過,要是你覺得用引號會讓你覺得更加舒服的話,當然也不會有任何問題。
6. 使你的內容可編輯
HTML5其中一個非常強大的功能就是“contenteditable”,顧名思義它將允許用戶編輯元素(包括他的子元素)內包含的任何文本內容。它的用途非常廣,如,簡單的任務清單或是基于wiki的站點也非常實用,此外,它還有一個優勢就是利用了本地的存儲。
或者,按照第五條技巧所說的,你也可以將第九行的代碼寫成這樣(不用引號):
7. 電子郵件輸入
如果我們應用“電子郵件”類型來指定輸入的形式,我們可以命令瀏覽器只允許符合有效電子郵件地址結構的字符串輸入。雖然說內置的表單驗證很快就會到來,但是我們也不能完全依靠這個。比較舊的瀏覽器不理解這種“電子郵件”類型,它們只會簡單地返回到普通的文本框。
在說到瀏覽器所支持和不支持的元素以及屬性時,你必需知道當前所有瀏覽器都不是那么可靠。例如,Opera只有在你指定name屬性時才支持電子郵件驗證。不過,它不支持占位符屬性(下面即將要講到的)。最后,雖然你可以使用這種形式的驗證,不過不要過分依賴它。
新聞熱點
疑難解答