溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

HTML5 語義化結構規(guī)范有哪些

發(fā)布時間:2021-06-24 14:40:43 來源:億速云 閱讀:179 作者:Leah 欄目:web開發(fā)

這篇文章將為大家詳細講解有關HTML5 語義化結構規(guī)范有哪些,文章內(nèi)容質量較高,因此小編分享給大家做個參考,希望大家閱讀完這篇文章后對相關知識有一定的了解。

HTML結構更加清晰、規(guī)范,學習HTML5優(yōu)化結構的思路。
HTML5添加了一些新元素,用來標識常用的結構,是html更具語義化,可是我們無法直接使用,即使可能用到還要等他個十年八年的。
那就像微格式一樣,使用class代替,或者隨意點,使用id和class名來代替,讓自己的結構更加清晰化,可以推廣為規(guī)范,讓團隊協(xié)作更加順暢。
一些新增的結構標記
◎section:這可以是書中的一章或一節(jié),實際上可以是在HTML4中有自己的標題的任何東西
◎header:頁面上顯示的頁眉;與head元素不一樣
◎footer:頁腳;可以顯示電子郵件中的簽名
◎nav:指向其他頁面的一組鏈接
◎article:blog、雜志、文章匯編等中的一篇文章
一些例子
HTML5的文檔結構
<header>...</header>
<nav>...</nav>
<article>
<section>...</section>
</article>
<aside>...</aside>
<footer>...</footer>
XHTML的文檔結構
<divid="header">header</div>
<divid="nav">nav</div>
<divclass="article">
<divclass="section">section</div>
</div>
<divid="aside">aside</div>
<divid="footer">footer</div>
HTML5的圖片結構
<figureid="fig2">
<legend>Figure2.InstallMozillaXFormsdialog</legend>
<imgalt="AWebsiteisrequestingpermissiontoinstalltheollowingitem:MozillaXForms0.7Unsigned"src="installdialog.jpg"/>
</figure>
XHTML的圖片結構
<divclass="figure">
<h5class="legend">Figure2.InstallMozillaXFormsdialog</h5>
<imgalt="AWebsiteisrequestingpermissiontoinstalltheollowingitem:MozillaXForms0.7Unsigned"src="installdialog.jpg"/>
</div>
HTML5的加上標記

  m元素表示文本被“加上標志”,但是不一定要強調(diào)??梢园阉胂癯蓵型怀鲲@示的一節(jié)。
  Google的緩存頁面就是典型的用例。如果鏈接到一個緩存的副本,搜索詞就被加上標志。例如,如果搜索“Egret”,那么緩存的Google頁面

關于HTML5 語義化結構規(guī)范有哪些就分享到這里了,希望以上內(nèi)容可以對大家有一定的幫助,可以學到更多知識。如果覺得文章不錯,可以把它分享出去讓更多的人看到。

向AI問一下細節(jié)

免責聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權內(nèi)容。

AI