web语义化与h5新增标签
生活随笔
收集整理的這篇文章主要介紹了
web语义化与h5新增标签
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
Web語(yǔ)義化就是html告訴我們也告訴機(jī)器這一塊是什么內(nèi)容，例如：“這行是一個(gè)標(biāo)題，這幾行組成一個(gè)段落，這是一個(gè)列表，那是一個(gè)鏈接。” Web語(yǔ)義化有三個(gè)階段：
1、h1~h6、thead、ul、ol等HTML標(biāo)簽。這些標(biāo)簽用于在Web頁(yè)面中組織對(duì)應(yīng)的內(nèi)容，如網(wǎng)頁(yè)標(biāo)題、表頭、無(wú)序、有序列表，以達(dá)到更方便的協(xié)作及傳播互聯(lián)網(wǎng)內(nèi)容。搜索引擎很好的利用了這些語(yǔ)義化標(biāo)簽抓取內(nèi)容。
2、隨著Web的發(fā)展，起初定義的HTML語(yǔ)義化標(biāo)簽，不足以實(shí)現(xiàn)對(duì)Web頁(yè)面各個(gè)部分的功能或位置描述，比如我們用div來(lái)表示頁(yè)面章節(jié)。所以Web前端人員利用HTML標(biāo)簽的id和class屬性，進(jìn)一步對(duì)HTML標(biāo)簽進(jìn)行描述，如對(duì)頁(yè)腳HTML標(biāo)簽添加如id="footer"或者class="footer"的屬性（值）。
3、W3C組織意識(shí)到了之前HTML版本的不足，推出的HTML5進(jìn)一步推進(jìn)了Web語(yǔ)義化發(fā)展，采用了諸如footer、section等語(yǔ)義化標(biāo)簽，彌補(bǔ)了采用id="footer"或者class="footer"形式的不足，以更好的推動(dòng)Web的發(fā)展。
HTML5新增語(yǔ)義化標(biāo)簽例舉：
1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <meta charset="utf-8"> 6 <title>h5新增的web語(yǔ)義化標(biāo)簽</title> 7 </head> 8 9 <body> 10 <header> 11 這是頭部 12 </header> 13 <nav> 14 這是導(dǎo)航 15 </nav> 16 <article> 17 這是正文 18 <section> 19 這是正文的段落1 20 </section> 21 <section> 22 這是正文的段落2 23 </section> 24 </article> 25 <aside> 26 這是側(cè)欄 27 <address> 28 這是地址 29 </address> 30 </aside> 31 <footer> 32 這是頁(yè)腳 33 </footer> 34 </body> 35 36 </html>
1、h1~h6、thead、ul、ol等HTML標(biāo)簽。這些標(biāo)簽用于在Web頁(yè)面中組織對(duì)應(yīng)的內(nèi)容，如網(wǎng)頁(yè)標(biāo)題、表頭、無(wú)序、有序列表，以達(dá)到更方便的協(xié)作及傳播互聯(lián)網(wǎng)內(nèi)容。搜索引擎很好的利用了這些語(yǔ)義化標(biāo)簽抓取內(nèi)容。
2、隨著Web的發(fā)展，起初定義的HTML語(yǔ)義化標(biāo)簽，不足以實(shí)現(xiàn)對(duì)Web頁(yè)面各個(gè)部分的功能或位置描述，比如我們用div來(lái)表示頁(yè)面章節(jié)。所以Web前端人員利用HTML標(biāo)簽的id和class屬性，進(jìn)一步對(duì)HTML標(biāo)簽進(jìn)行描述，如對(duì)頁(yè)腳HTML標(biāo)簽添加如id="footer"或者class="footer"的屬性（值）。
3、W3C組織意識(shí)到了之前HTML版本的不足，推出的HTML5進(jìn)一步推進(jìn)了Web語(yǔ)義化發(fā)展，采用了諸如footer、section等語(yǔ)義化標(biāo)簽，彌補(bǔ)了采用id="footer"或者class="footer"形式的不足，以更好的推動(dòng)Web的發(fā)展。
HTML5新增語(yǔ)義化標(biāo)簽例舉：
1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <meta charset="utf-8"> 6 <title>h5新增的web語(yǔ)義化標(biāo)簽</title> 7 </head> 8 9 <body> 10 <header> 11 這是頭部 12 </header> 13 <nav> 14 這是導(dǎo)航 15 </nav> 16 <article> 17 這是正文 18 <section> 19 這是正文的段落1 20 </section> 21 <section> 22 這是正文的段落2 23 </section> 24 </article> 25 <aside> 26 這是側(cè)欄 27 <address> 28 這是地址 29 </address> 30 </aside> 31 <footer> 32 這是頁(yè)腳 33 </footer> 34 </body> 35 36 </html>
?
轉(zhuǎn)載于:https://www.cnblogs.com/weirihan/p/5880816.html
總結(jié)
以上是生活随笔為你收集整理的web语义化与h5新增标签的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： 制作NFS
- 下一篇： 中国分布式光纤传感（DFOS）行业竞争现