HTML5新增和刪除的標(biāo)簽有哪些

這篇文章主要介紹“HTML5新增和刪除的標(biāo)簽有哪些”的相關(guān)知識，小編通過實(shí)際案例向大家展示操作過程，操作方法簡單快捷，實(shí)用性強(qiáng)，希望這篇“HTML5新增和刪除的標(biāo)簽有哪些”文章能幫助大家解決問題。

　　HTML5增強(qiáng)了瀏覽器的原生功能，符合HTML5規(guī)范的瀏覽器功能將更加強(qiáng)大，減少了Web應(yīng)用對插件的依賴，讓用戶體驗(yàn)更好，讓開發(fā)更加方便，另外W3C從推出HTML4.0到5.0之間共經(jīng)歷了17年，HTML的變化很小，這并不符合一個(gè)好產(chǎn)品的演進(jìn)規(guī)則。

　　以下的 HTML 4.01 元素在HTML5中已經(jīng)被刪除：

　　<acronym>

　　<applet>

　　<basefont>

　　<big>

　　<center>

　　<dir>

　　<font>

　　<frame>

　　<frameset>

　　<noframes>

　　<strike>

　　<article>標(biāo)簽定義外部的內(nèi)容。比如來自一個(gè)外部的新聞提供者的一篇新的文章，或者來自 blog 的文本，或者是來自論壇的文本。

　　HTML5:<article></article>

　　HTML4:<div></div>

　　<aside>標(biāo)簽定義 article 以外的內(nèi)容。aside 的內(nèi)容應(yīng)該與 article 的內(nèi)容相關(guān)。

　　HTML5:<aside>Aside 的內(nèi)容是獨(dú)立的內(nèi)容，但應(yīng)與文檔內(nèi)容相關(guān)。</aside>

　　HTML4:<div>Aside 的內(nèi)容是獨(dú)立的內(nèi)容，但應(yīng)與文檔內(nèi)容相關(guān)。</div>

　　<audio> 標(biāo)簽定義聲音，比如音樂或其他音頻流。

　　HTML5:<audio src="">您的瀏覽器不支持 audio 標(biāo)簽。</audio>

　　HTML4:<object type="application/ogg" data="someaudio.wav"><param name="src" value="someaudio.wav"></object>

　　<canvas> 標(biāo)簽定義圖形，比如圖表和其他圖像。這個(gè) HTML 元素是為了客戶端矢量圖形而設(shè)計(jì)的。它自己沒有行為，但卻把一個(gè)繪圖 API 展現(xiàn)給客戶端 JavaScript 以使腳本能夠把想繪制的東西都繪制到一塊畫布上。

　　HTML5:<canvas id="myCanvas" width="200" height="200"></canvas>

　　HTML4:<object data="inc/hdr.svg" type="image/svg+xml" width="200" height="200"></object>

　　<command> 標(biāo)簽定義命令按鈕，比如單選按鈕、復(fù)選框或按鈕。

　　HTML5: <command onclick=cut（）" label="cut">

　　HTML4: none

　　<datalist> 標(biāo)簽定義可選數(shù)據(jù)的列表。與 input 元素配合使用，就可以制作出輸入值的下拉列表。

　　HTML5: <datalist></datalist>

　　HTML4: see combobox.

　　<details> 標(biāo)簽定義元素的細(xì)節(jié)，用戶可進(jìn)行查看，或通過點(diǎn)擊進(jìn)行隱藏。與 <legend> 一起使用，來制作 detail 的標(biāo)題。該標(biāo)題對用戶是可見的，當(dāng)在其上點(diǎn)擊時(shí)可打開或關(guān)閉 detail。

　　HTML5: <details></details>

　　HTML4: <dl style="display:hidden"></dl>

　　<embed> 標(biāo)簽定義嵌入的內(nèi)容，比如插件。

　　HTML5: <embed src="" />

　　HTML4: <object data="flash.swf" type="application/x-shockwave-flash"></object>

　　<figcaption> 標(biāo)簽定義 figure 元素的標(biāo)題?！眆igcaption” 元素應(yīng)該被置于 “figure” 元素的第一個(gè)或最后一個(gè)子元素的位置。

　　HTML5: <figure><figcaption>PRC</figcaption></figure>

　　HTML4: none

　　<figure> 標(biāo)簽用于對元素進(jìn)行組合。使用 <figcaption> 元素為元素組添加標(biāo)題。

　　HTML5: <figure><figcaption>PRC</figcaption><p>The People's Republic of China was born in 1949&hellip;</p></figure>

　　HTML4: <dl><h2>PRC</h2><p>The People's Republic of China was born in 1949&hellip;</p></dl>

　　<footer> 標(biāo)簽定義 section 或 document 的頁腳。典型地，它會(huì)包含創(chuàng)作者的姓名、文檔的創(chuàng)作日期以及/或者聯(lián)系信息。

　　HTML5: <footer></footer>

　　HTML4: <div></div>

　　<header> 標(biāo)簽定義 section 或 document 的頁眉。

　　HTML5: <header></header>

　　HTML4: <div></div>

　　<hgroup> 標(biāo)簽用于對網(wǎng)頁或區(qū)段（section）的標(biāo)題進(jìn)行組合。

　　HTML5: <hgroup></hgroup>

　　HTML4: <div></div>

　　<keygen> 標(biāo)簽定義生成密鑰。

　　HTML5: <keygen>

　　HTML4: none

　　<mark>主要用來在視覺上向用戶呈現(xiàn)那些需要突出的文字。<mark>標(biāo)簽的一個(gè)比較典型的應(yīng)用就是在搜索結(jié)果中向用戶高亮顯示搜索關(guān)鍵詞。

　　HTML5: <mark></mark>

　　HTML4: <span></span>

　　<meter> 標(biāo)簽定義度量衡。僅用于已知最大和最小值的度量。必須定義度量的范圍，既可以在元素的文本中，也可以在 min/max 屬性中定義。

　　HTML5: <meter></meter>

　　HTML4: none

　　<nav> 標(biāo)簽定義導(dǎo)航鏈接的部分。

　　HTML5: <nav></nav>

　　HTML4:<ul></ul>

　　<output> 標(biāo)簽定義不同類型的輸出，比如腳本的輸出。

　　HTML5: <output></output>

　　HTML4: <span></span>

　　<progress> 標(biāo)簽運(yùn)行中的進(jìn)程?？梢允褂?<progress> 標(biāo)簽來顯示 JavaScript 中耗費(fèi)時(shí)間的函數(shù)的進(jìn)程。

　　HTML5: <progress></progress>

　　HTML4: none

　　<rp> 標(biāo)簽在 ruby 注釋中使用，以定義不支持 ruby 元素的瀏覽器所顯示的內(nèi)容。

　　HTML5: <ruby>漢 <rt><rp>（</rp>ㄏㄢˋ<rp>）</rp></rt></ruby>

　　HTML4: none

　　<rt> 標(biāo)簽定義字符（中文注音或字符）的解釋或發(fā)音。

　　HTML5: <ruby>漢 <rt> ㄏㄢˋ </rt></ruby>

　　HTML4: none

　　<ruby> 標(biāo)簽定義 ruby 注釋（中文注音或字符）。

　　HTML5: <ruby>漢 <rt><rp>（</rp>ㄏㄢˋ<rp>）</rp></rt></ruby>

　　HTML4: none

　　<section> 標(biāo)簽定義文檔中的節(jié)（section、區(qū)段）。比如章節(jié)、頁眉、頁腳或文檔中的其他部分。

　　HTML5: <section></section>

　　HTML4: <div></div>

　　<source> 標(biāo)簽為媒介元素（比如 <video> 和 <audio>）定義媒介資源。

　　HTML5: <source>

　　HTML4: <param>

　　<summary> 標(biāo)簽包含 details 元素的標(biāo)題，”details” 元素用于描述有關(guān)文檔或文檔片段的詳細(xì)信息?！眘ummary” 元素應(yīng)該是 “details” 元素的第一個(gè)子元素。

　　HTML5: <details><summary>HTML 5</summary>This document teaches you everything you have to learn about HTML 5.</details>

　　HTML4: none

　　<time> 標(biāo)簽定義日期或時(shí)間，或者兩者。

　　HTML5: <time></time>

　　HTML4: <span></span>

　　<video> 標(biāo)簽定義視頻，比如電影片段或其他視頻流。

　　HTML5: <video src="" controls="controls">您的瀏覽器不支持 video 標(biāo)簽。</video>

　　HTML4:<object type="video/ogg" data="movie.ogv"><param name="src" value="movie.ogv"></object>

　　表示特定范圍內(nèi)的數(shù)值，可用于工資、數(shù)量、百分比等 max表示最大值，min表示最小值，value代表當(dāng)前值。

　　可以試試用js控制讓它從0變化到100。

　　time。表示時(shí)間值，屬性datetime強(qiáng)調(diào)時(shí)間

　　大會(huì)時(shí)間：<time>2015-10-6</time>

　　運(yùn)行效果：

　　因?yàn)樵摌?biāo)簽是一個(gè)語義標(biāo)簽，在瀏覽器上查看時(shí)沒有特別的效果，基本與沒有設(shè)置標(biāo)簽的效果相同。

　　用來表示進(jìn)度條

　　max：最大值，完成時(shí)的值

　　value：當(dāng)前值

　　firefox運(yùn)行結(jié)果：

　　chrome運(yùn)行結(jié)果：

　　該標(biāo)簽定義可選數(shù)據(jù)的列表。與 input 元素配合使用，就可以制作出輸入值的下拉列表。

　　當(dāng)與input組合時(shí)既可以完成選擇有可以輸入。

　　在沒有使用HTML5時(shí)如果要在頁面中播放音頻與視頻，則可以使用的方法有：

　　a）、embed

　　<embed src=""></embed>

　　如一些三方插件，flowplayer602

　　html5多媒體組件指的是video（視頻）組件和audio（音頻）組件。HTML5多媒體組件可以在不借助諸如Flash Player等第三方插件的情況下，直接在你的網(wǎng)頁上嵌入多媒體組件。瀏覽器提供原生支持視頻的新能力使得網(wǎng)頁開發(fā)人員更易于在不依賴于外置插件有效性的情況下，在他們的網(wǎng)站上添加視頻組件。由于蘋果公司現(xiàn)階段在iPhone和iPad上使用的Flash技術(shù)的局限性，HTML5多媒體組件的能力就顯得尤為重要了。

　　用于在播放視頻，電影

　　標(biāo)簽基本格式如下：

　　運(yùn)行效果：

　　source是視頻源，可以有多種，當(dāng)一種失敗時(shí)將選擇下一種，主要有如下3種：

　　Ogg=帶有 Theora 視頻編碼和 Vorbis 音頻編碼的 Ogg 文件

　　MPEG4=帶有 H.264 視頻編碼和 AAC 音頻編碼的 MPEG 4 文件

　　WebM=帶有 VP8 視頻編碼和 Vorbis 音頻編碼的 WebM 文件

　　格式支持情況：

　　標(biāo)簽屬性：

　　source子標(biāo)簽屬性：

　　video API方法

　　video API屬性

　　video API事件

　　注意：

　　多數(shù)的HTML5標(biāo)簽的innerHTML內(nèi)容是瀏覽器不支持該標(biāo)簽時(shí)顯示的內(nèi)容。

　　事件綁定與監(jiān)聽的區(qū)別：

　　運(yùn)行結(jié)果：

　　使用on事件名的形式綁定事件后綁定會(huì)覆蓋前面綁定的事件，也就是最后一個(gè)綁定的事件會(huì)生效；

　　使用addEventListener綁定事件則不會(huì)覆蓋，可同時(shí)在一個(gè)元素上綁定多個(gè)相同的事件。

　　video API的屬性與事件示例：

　　運(yùn)行結(jié)果：

　　練習(xí)：

　　練習(xí)代碼：

　　audio可以實(shí)現(xiàn)播放聲音，音樂功能。

　　<audio src= controls >

　　您的瀏覽器不支持audio元素

　　</autio>

　　audio標(biāo)簽的屬性，很多屬性都是與video相同的：

　　autoplay：true|false，如果是 true，則音頻在就緒后馬上播放。

　　controls：true|false 如果是true，則向用戶顯示控件，比如播放按鈕。

　　end：numeric value 定義播放器在音頻流中的何處停止播放。默認(rèn)地，聲音會(huì)播放到結(jié)尾。

　　loopend：numeric value 定義在音頻流中循環(huán)播放停止的位置，默認(rèn)是 end 屬性的值。

　　loopstart： numeric value 定義在音頻流中循環(huán)播放的開始位置。默認(rèn)是 start 屬性的值。

關(guān)于“HTML5新增和刪除的標(biāo)簽有哪些”的內(nèi)容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識，可以關(guān)注億速云行業(yè)資訊頻道，小編每天都會(huì)為大家更新不同的知識點(diǎn)。