十年網(wǎng)站開發(fā)經(jīng)驗 + 多家企業(yè)客戶 + 靠譜的建站團隊
量身定制 + 運營維護+專業(yè)推廣+無憂售后,網(wǎng)站問題一站解決
這篇文章給大家分享的是有關(guān)html5新增加的結(jié)構(gòu)標簽是什么的內(nèi)容。小編覺得挺實用的,因此分享給大家做個參考,一起跟隨小編過來看看吧。
公司主營業(yè)務(wù):網(wǎng)站建設(shè)、成都做網(wǎng)站、移動網(wǎng)站開發(fā)等業(yè)務(wù)。幫助企業(yè)客戶真正實現(xiàn)互聯(lián)網(wǎng)宣傳,提高企業(yè)的競爭能力。成都創(chuàng)新互聯(lián)是一支青春激揚、勤奮敬業(yè)、活力青春激揚、勤奮敬業(yè)、活力澎湃、和諧高效的團隊。公司秉承以“開放、自由、嚴謹、自律”為核心的企業(yè)文化,感謝他們對我們的高要求,感謝他們從不同領(lǐng)域給我們帶來的挑戰(zhàn),讓我們激情的團隊有機會用頭腦與智慧不斷的給客戶帶來驚喜。成都創(chuàng)新互聯(lián)推出廣元免費做網(wǎng)站回饋大家。
html5新增加的結(jié)構(gòu)標簽有:1、section標簽,定義文檔中的節(jié);2、article標簽;3、nav標簽;4、aside標簽;5、header標簽,定義文檔的頁眉;6、footer標簽;7、hgroup標簽;8、figure標簽。
本教程操作環(huán)境:windows7系統(tǒng)、HTML5版、Dell G3電腦。
在之前的HTML頁面中,大家基本上都是用了p+CSS的布局方式。而搜索引擎去抓取頁面的內(nèi)容的時候,它只能猜測你的某個p內(nèi)的內(nèi)容是文章內(nèi)容容器,或者是導(dǎo)航模塊的容器,或者是作者介紹的容器等等。也就是說整個HTML文檔結(jié)構(gòu)定義不清晰,HTML5中為了解決這個問題,專門添加了:頁眉、頁腳、導(dǎo)航、文章內(nèi)容等跟結(jié)構(gòu)相關(guān)的結(jié)構(gòu)元素標簽。
在講這些新標簽之前,我們先看一個普通的頁面的布局方式:
上圖中我們非常清晰的看到了,一個普通的頁面,會有頭部,導(dǎo)航,文章內(nèi)容,還有附著的右邊欄,還有底部等模塊,而我們是通過class進行區(qū)分,并通過不同的css樣式來處理的。但相對來說class不是通用的標準的規(guī)范,搜索引擎只能去猜測某部分的功能,另外就是此頁面程序交給視力障礙人士來閱讀的話,文檔結(jié)構(gòu)和內(nèi)容也不會很清晰。而HTML5新標簽帶來的新的布局則是下面這種情況:
相關(guān)的HTML代碼是:
... ...
有了上面的直接的感官的認識后,我們下面一一來介紹HTML5中的相關(guān)結(jié)構(gòu)標簽。
section標簽
當我們描述一件具體的事物的時候,通常鼓勵使用article來代替section;當我們使用section時,仍然可以使用h2來作為標題,而不用擔心它所處的位置,以及其它地方是否用到;當一個容器需要被直接定義樣式或通過腳本定義行為時,推薦使用p元素而非section。
section是什么?
一個新的章節(jié)
關(guān)于section
section的介紹
...
article標簽
這是一篇介紹HTML 5結(jié)構(gòu)標簽的文章
HTML 5的革新
文章內(nèi)容詳情
nav標簽
nav標簽代表頁面的一個部分,是一個可以作為頁面導(dǎo)航的鏈接組,其中的導(dǎo)航元素鏈接到其它頁面或者當前頁面的其它部分,使html代碼在語義化方面更加精確,同時對于屏幕閱讀器等設(shè)備的支持也更好。
aside標簽
aside標簽用來裝載非正文的內(nèi)容,被視為頁面里面一個單獨的部分。它包含的內(nèi)容與頁面的主要內(nèi)容是分開的,可以被刪除,而不會影響到網(wǎng)頁的內(nèi)容、章節(jié)或是頁面所要傳達的信息。例如廣告,成組的鏈接,側(cè)邊欄等等。
header標簽
通常-
網(wǎng)站標題
網(wǎng)站副標題
footer標簽
footer標簽定義section或document的頁腳,包含了與頁面、文章或是部分內(nèi)容有關(guān)的信息,比如說文章的作者或者日期。作為頁面的頁腳時,一般包含了版權(quán)、相關(guān)文件和鏈接。它和
hgroup標簽
hgroup標簽是對網(wǎng)頁或區(qū)段section的標題元素(h2-h7)進行組合。例如,在一區(qū)段中你有連續(xù)的h系列的標簽元素,則可以用hgroup將他們括起來
這是一篇介紹HTML 5結(jié)構(gòu)標簽的文章
HTML 5的革新
figure 標簽
用于對元素進行組合。多用于圖片與圖片描述組合。
![]()
這兒是圖片的描述信息
感謝各位的閱讀!關(guān)于“html5新增加的結(jié)構(gòu)標簽是什么”這篇文章就分享到這里了,希望以上內(nèi)容可以對大家有一定的幫助,讓大家可以學到更多知識,如果覺得文章不錯,可以把它分享出去讓更多的人看到吧!