【零基礎(chǔ)入門前端系列】—語義化標(biāo)簽、實(shí)體字符、視頻、音頻（八）

一、什么是HTML語義化標(biāo)簽

語義化的標(biāo)簽，旨在讓標(biāo)簽有自己的含義

如上代碼：p標(biāo)簽與span標(biāo)簽的區(qū)別之一就是，p標(biāo)簽的含義是段落而span標(biāo)簽沒有獨(dú)特的含義。

二、語義化標(biāo)簽的優(yōu)勢

• 代碼結(jié)構(gòu)清晰，方便閱讀，有利于團(tuán)隊(duì)合作開發(fā)。
• 方便其他設(shè)備解析以語義的方式來渲染網(wǎng)頁。
• 有利于搜索引擎優(yōu)化（SEO）。

三、無語義的布局標(biāo)簽

• div：塊級元素，沒有任何意義的一個容器、盒子
• span：行內(nèi)元素，無語義化。

四、實(shí)體字符

當(dāng)HTML頁面不能識別一些特殊的字符時，可以使用實(shí)體字符來替代。

空格  
<  &lt;
> &gt;
版權(quán) &copy;

五、HTML5新增布局標(biāo)簽

在HTML5出現(xiàn)之前，我們一般采用div+css布局頁面。但這樣的布局方式不僅使我們的文檔結(jié)構(gòu)不夠清晰，而且不利于搜索引擎爬蟲對我們頁面的爬取。為此，HTML5新增了很多語義化標(biāo)簽。

六、視頻和音頻

🎈視頻
Video標(biāo)簽定義視頻，比如看電影片段或其它視頻流。

    <video src="/images/v.mp4" controls="controls" autoplay>       
您的瀏覽器不支持 video 標(biāo)簽。</video>

視頻常用的屬性如下：

🎈🎈音頻
audio標(biāo)簽定義音頻，比如音樂或者其他的音頻流。支持格式：MP3、ogg、wav

音頻常用屬性：

• src:必須屬性，路徑
• autoplay：自動播放
• loop：循環(huán)播放
• controls 顯示控制面板
• muted 靜音

🎈🎈🎈source
<source>標(biāo)簽為媒介元素，<source>標(biāo)簽允許您規(guī)定的視頻/音頻文件供瀏覽器根據(jù)它對媒體類型或者編解碼器的支持進(jìn)行選擇。