首頁 >web前端 >H5教程 >HTML5 語意化結構化規範化_html5教學技巧

HTML5 語意化結構化規範化_html5教學技巧

WBOY
WBOY原創
2016-05-16 15:51:391465瀏覽
HTML結構更清楚、規範,學習HTML5最佳化結構的想法。
HTML5增加了一些新元素,用來識別常用的結構,是html更具語義化,可是我們無法直接使用,即使可能用到還要等他個十年八年的。
那就像微格式一樣,使用class代替,或者隨意點,使用id和class名來代替,讓自己的結構更加清晰化,可以推廣為規範,讓團隊協作更加順暢。
一些新增的結構標記
◎section:這可以是書中的一章或一節,實際上可以是在HTML4中有自己的標題的任何東西
◎header:頁面上顯示的頁眉;與head元素不一樣
◎footer:頁腳;可以顯示電子郵件中的簽名
◎nav:指向其他頁面的一組連結
◎article: blog、雜誌、文章彙編等中的一篇文章
一些例子
HTML5的文件結構
...



...




...
...
XHTML的文檔結構
header
nav

section
section


footer
HTML5的圖片結構

Figure2.InstallMozillaXFormsdialog


XHTML的圖片結構

Figure2.InstallMozillaXFormsdialog



HTML5的加上標記  m元素表示文字被“加上標誌”,但是不一定要強調。你可以把它想像成書中突出顯示的一節。   Google的快取頁面就是典型的用例。如果連結到一個快取的副本,搜尋字詞就被加上標誌。例如,如果搜尋“Egret”,那麼快取的Google頁面可能像下面這樣: TheGreatEgret(alsoknownastheAmericanEgret)isalargewhitewadingbirdfoundworldwide.TheGreatEgretflieswithslowbem.TheGreatEgretEgret (alsoknownastheAmericanEgret)isalargewhitewadingbirdfoundworldwide.TheGreatEgretflieswithslowwingbeats.ThescientificnameoftheGreatflieswithslowwingbeats.ThescientificnameoftheGreat
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn