溫馨提示×

溫馨提示×

您好，登錄后才能下訂單哦！

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

html5基礎(chǔ)標(biāo)簽以及用法是怎樣的

發(fā)布時間：2021-10-08 11:32:04 來源：億速云 閱讀：150 作者：柒染 欄目：web開發(fā)

html5基礎(chǔ)標(biāo)簽以及用法是怎樣的，針對這個問題，這篇文章詳細(xì)介紹了相對應(yīng)的分析和解答，希望可以幫助更多想解決這個問題的小伙伴找到更簡單易行的方法。

1、  聲明的變化<!DOCTYPE html >

2、  指定字符編碼的變化<meta charset=”utf-8&Prime;>，html5中建議使用utf-8

3、  Html5中允許<p>沒有結(jié)束符，不算錯誤

4、  不允許寫結(jié)束標(biāo)記的有：area、base、br、col、command、embed、hr、img、input、keygen、link、meta、param、source、track、wbr

5、  可以省略結(jié)束標(biāo)記的元素有：li、dt、dd、p、rt、rp、optgroup、option、colgroup、thead、tbody、tfoot、tr、td、th

6、  可以省略全部標(biāo)記的元素有：html、head、body、colgroup、tbody

7、  <input type=text> 之前屬性值text是要有雙引號的，現(xiàn)在也可以省略

8、 見html5標(biāo)記示例

9、 新增的結(jié)構(gòu)元素section：容器元素。章節(jié)、頁眉、頁腳，可以與h2、h3&hellip;結(jié)合起來用，標(biāo)示文檔結(jié)構(gòu)。也可用于封裝標(biāo)題+內(nèi)容，但是沒有標(biāo)題是不當(dāng)?shù)摹．?dāng)一個容器元素需要被直接定義樣式活腳本定義行為時，推薦使用div，而非section。作用：對頁面內(nèi)容進(jìn)行分塊。不要與有著自己的完整的、獨(dú)立的內(nèi)容的article元素混淆?？偨Y(jié)：①不要將section元素用作設(shè)置樣式的頁面容器，那是div元素的工作。②如果article元素、aside元素、或nav元素更符合使用條件，不要使用section元素。③不要為沒有標(biāo)題的內(nèi)容區(qū)塊使用section元素。

10、新增的結(jié)構(gòu)元素article：塊級元素。表示頁面中的一塊與上下文不像個的獨(dú)立內(nèi)容。強(qiáng)調(diào)獨(dú)立性，section強(qiáng)調(diào)分段或分塊，article強(qiáng)調(diào)獨(dú)立性。

11、新增的結(jié)構(gòu)元素aside：塊級元素。表示article元素的內(nèi)容職位的，與article元素內(nèi)容相關(guān)的輔助內(nèi)容。

12、新增的結(jié)構(gòu)元素Header：塊級元素。整個頁面的標(biāo)題。Header中至少要有一個heading（h2&mdash;h7）或hgroup元素或nav元素。

13、新增的結(jié)構(gòu)元素hgroup：塊級元素。用于對整個頁面或頁面中一個內(nèi)容區(qū)塊的標(biāo)題進(jìn)行組合。如果只有一個主標(biāo)題，是不需要hgroup的。

14、新增的結(jié)構(gòu)元素footer：塊級元素。內(nèi)容區(qū)塊的腳注。

15、新增的結(jié)構(gòu)元素address：行內(nèi)元素。呈現(xiàn)文檔聯(lián)系信息，包括：作者、郵箱等等。

16、新增的結(jié)構(gòu)元素nav：塊級元素。導(dǎo)航鏈接。傳統(tǒng)導(dǎo)航、側(cè)邊欄導(dǎo)航、頁內(nèi)導(dǎo)航、翻頁導(dǎo)航。H5中不要用menu替代nav，menu元素是用一系列發(fā)出命令的菜單上，是一種交互性的元素。更確切的說是使用在web應(yīng)用程序中的。

17、新增的結(jié)構(gòu)元素figure：塊級元素。一段獨(dú)立的流內(nèi)容，一般表示文檔主題流內(nèi)容的一個獨(dú)立單元。使用figcaption元素為figure元素組添加標(biāo)題。

18、新增元素video：定義視頻的。

代碼如下:


<video width="320" height="240" src="”movie.ogg”" controls="controls">video元素</video>

19、新增元素audio：定義音頻的。

代碼如下:


<audio width="300" height="32" src="”someaudio.wav”">audio元素</audio>

20、新增元素embed： 插入各種媒體，格式可以是midi、wav、aiff、au、mp3等。

21

代碼如下:


<object width="320" height="240" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="<a href="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param">http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param</a> name="src" value="”borse.wav”/" /><embed width="320" height="240" type="application/x-shockwave-flash" src="”borse.wav”/" /></object>

22、新增元素mark： 突出顯示或高亮顯示的文字。相當(dāng)與span

23、新增元素progress：表示運(yùn)行中的進(jìn)程，顯示javascript中消耗時間的函數(shù)進(jìn)程。

代碼如下:


<meter></meter>

24、新增元素Time：表示日期和時間。

代碼如下:


<time></time>

H4中用span
25、新增元素ruby：表示ruby注釋。韓han,h5中沒有的

26、新增元素rt：表示字符的解釋或發(fā)音

27、新增元素rp：在ruby中使用，以定義不支持ruby元素的瀏覽器所顯示的內(nèi)容。

28、新增元素wbr：表示軟換行。與br的區(qū)別是br表示此處必須換行；而wbr是瀏覽器或者父級元素的寬度足夠?qū)挄r，不進(jìn)行換行，寬度不夠時，主動在此處換行。Wbr對字符型語言作用挺大，但是對于中文，貌似沒有多大的作用。H4中沒有的。

29、新增元素Canvas：表示圖形的。如：圖表、圖像。但是：這個元素本身沒有行為。僅提供一塊畫布，把繪制api展現(xiàn)給客戶端javascript，使腳本能夠把繪制的東西繪制到這塊畫布上。

代碼如下:


<canvas id="”rrr”" width="”200”" height="”220”"> </canvas>

30、新增元素command：表示命令按鈕。如：單選按鈕、復(fù)選框、按鈕。

代碼如下:


<command onclick="cut()" label="cut"></command>

html4中沒有

31、新增元素details：表示Details用戶要求得到并且可以得到的細(xì)節(jié)信息?？梢耘csummary配合使用。Summary提供標(biāo)題或圖例。

代碼如下:


<details> <summary>html5</summary>this ji a ddddd,you kdkdkdk about html5

</details>


 
32、新增元素datagrid：表示數(shù)據(jù)的列表。以樹形列表的形式顯示

33、新增元素keygen：表示生成密鑰

34、新增元素output：表示不同類型的輸出。如腳本

35、新增元素source：媒介元素。定義媒介資源。H4中用param

36、新增元素menu：表示菜單列表。

代碼如下:


<menu><li></li><li></li</menu>

h5中menu不被推薦使用。

37、新增input元素類型email：表示必須輸入e-mail的文本輸入框。

38、新增input元素類型url：表示必須輸入url地址的

39、新增input元素類型number：表示必須輸入數(shù)值。

40、新增input元素類型range：表示必須輸入一定范圍內(nèi)數(shù)字值的

41、新增input元素類型date pickers：h6中有多個可選取日期和時間的新型輸入文本框。

代碼如下:


Date--------------選取日、月、年
Month-----------選取月、年
Week------------選取周和年
Time-------------選取時間（小時和分鐘）
Datetime-------選取時間、日、月、年（utc時間）
Datetime-local&mdash;選取時間、日、月、年（本地時間）

44、
1) 廢除元素：只有部分瀏覽器支持的元素：applet、bgsound（只有ie支持）、blink、marquee等元素。bgsound（只有ie支持）、marquee（只有ie支持），所以在h6中廢除。applet&mdash;可由embed或object替代。Bgsound&mdash;可由audio替代。Marquee可由js編程方式替代。
2)標(biāo)簽 手冊釋義：用于對元素進(jìn)行組合。 使用指引：多用于圖片與圖片描述組合：

代碼如下:


<figure>
<img title="figure標(biāo)簽" src="img.gif" alt="figure標(biāo)簽" />
<figcaption>這兒是圖片的描述信息</figcaption>
</figure>


3)標(biāo)簽 手冊釋義：定義菜單列表。當(dāng)希望列出表單控件時使用該標(biāo)簽。 使用指引：使用于菜單類區(qū)塊，用來定義菜單列表或菜單選項(xiàng):

代碼如下:


</pre>
<menu>
   <li>HTML 5</li>
   <li>CSS</li>
   <li>JavaScript</li>
</menu>
<pre>

關(guān)于html5基礎(chǔ)標(biāo)簽以及用法是怎樣的問題的解答就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，如果你還有很多疑惑沒有解開，可以關(guān)注億速云行業(yè)資訊頻道了解更多相關(guān)知識。

向AI問一下細(xì)節(jié)

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

AI
助
手