小編給大家分享一下HTML5新特性是什么，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

創(chuàng)新互聯(lián)公司主營平川網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營網(wǎng)站建設(shè)方案,app軟件開發(fā)公司,平川h5小程序定制開發(fā)搭建,平川網(wǎng)站營銷推廣歡迎平川等地區(qū)企業(yè)咨詢

一、HTML5與HTML4

1.1 推出的理由和目標(biāo)

H5的出現(xiàn)，對(duì)于Web來說意義重大。因?yàn)樗囊鈭D是想要把目前Web上存在的各種問題一并解決掉。

1. Web瀏覽器之間的兼容性很低

2. 文檔結(jié)構(gòu)不夠明確（增加了很多結(jié)構(gòu), 語義化的標(biāo)簽）

3. Web應(yīng)用程序的功能受到了限制

H5 的出現(xiàn)極大的解決了上面的問題

1.2 語法的改變

1.2.1 DOCTYPE聲明

H5   DOCTYPE的聲明是這樣的：

Html:4s   DOCTYPE的聲明是這樣的：

Html: 4t   DOCTYPE 的聲明是這樣的

1.2.2 指定字符編碼

H5指定字符編碼格式如下：

Html:4s 指定字符編碼如下：

1.2.3 可以省略結(jié)束標(biāo)記的元素

給大家舉一個(gè)簡單的例子就明白啥玩意了
我們平常寫 p  標(biāo)簽 是這樣寫的：

  
  
Hello  world!
  

新的寫法可以這樣寫：

    
    
Hello world!
    

如果大家不相信，可以親自去測(cè)試一下，怎么測(cè)試呢？很簡單，就是分別設(shè)置他們的樣式即可，看看是否一樣，若一樣，證明二者是等價(jià)的！注意：設(shè)置 p標(biāo)簽的樣式。

1.2.4 具有boolean值的屬性（disabled，checked）

disabled 多用于input元素，button元素，option元素等 ，意思是 是否禁用這些 元素  ，用法如下：

其中屬性值“disabled”可以替換成任何的其它單詞甚至是“enabled”（不過“false”除外），因?yàn)閷傩灾禐椤癴alse”時(shí)表示屬性不啟用，屬性值“true”表示啟用屬性。如下代碼的button元素都處于禁用狀態(tài)：

如下代碼的button元素處于啟用狀態(tài)：

checked 用法和disabled一樣，這里小編就不在過多贅述！

1.2.5 省略引號(hào) （標(biāo)簽內(nèi)的屬性值可以省略引號(hào)）

H5之前屬性值的寫法是這樣寫的，以  img 標(biāo)簽的 src 屬性為例：

目前可以這樣寫：

二者的結(jié)果是一樣的。都能夠正常顯示圖片

1.3 新增的語義化標(biāo)簽

什么是語義化？

語義化是指用合理HTML標(biāo)記以及其特有的屬性去格式化文檔內(nèi)容。通俗地講,語義化就是對(duì)數(shù)據(jù)和信息進(jìn)行處理,使得機(jī)器可以理解.語義化

新增的語義化標(biāo)簽：Section、article、aside、header、hgroup、footer、nav、figure

具體用法：新增語義化標(biāo)簽的用法

1.4 新增的"花樣"標(biāo)簽元素

video、audio、canvas、embed、mark、progress、meter、time、ruby、rt、rp、wbr、command、details、datalist、datagrid、keygen、output、source、menu

這些標(biāo)簽小編這里就不在一 一介紹用法了。用的時(shí)候直接百度就行。一般用的也不多，記住有這個(gè)東西就行。(面試的時(shí)候可能會(huì)用到)

1.5 新增的 input 類型

Email、url、number、range、DatePickers
這里只給出部分講解：

1. number

1. range

其余的小編就不測(cè)試了，有心的你可以測(cè)試一下！

1.6 廢除的標(biāo)簽

1. 能使用CSS替代的basefont、big、center、font、s、tt、u等

2. 不再使用frame框架

3. 只有部分瀏覽器支持的元素

4. 其他被廢除的元素

1.7 新增的全局屬性

全局屬性是指對(duì)所有標(biāo)簽都可以使用的屬性

• contentEditable屬性(規(guī)定內(nèi)容是否可編輯)

• designMode屬性(這個(gè)在js中進(jìn)行使用，讓頁面中所有的元素開啟可編輯模式)

            window.onload = function() {
            document.designMode = "on";
        }

• hidden屬性

• spellcheck屬性 （input和textarea提供的新屬性，做了語法檢查）

• tabindex屬性  (讓標(biāo)簽獲取到焦點(diǎn))

      你好
      hello world!
      html5

二、新增的語義化標(biāo)簽

2.1 新增元素

1.  頁眉

主要用于頁面的頭部的信息介紹，也可用于板塊頭部

1. 頁腳

頁面的底部 或者 版塊底部

1. 導(dǎo)航  (包含鏈接的的一個(gè)列表)

1.  頁面上的一個(gè)標(biāo)題組合

        

                 
旅游
                 
上海
      

1. 頁面上的板塊

用于劃分頁面上的不同區(qū)域,或者劃分文章里不同的節(jié)

1. 用來在頁面中表示一套結(jié)構(gòu)完整且獨(dú)立的內(nèi)容部分

可以用來呈現(xiàn)論壇的一個(gè)帖子，雜志或報(bào)紙中的一篇文章，一篇博客，用戶提交的評(píng)論內(nèi)容，可互動(dòng)的頁面模塊掛件等

該元素標(biāo)簽可以包含與當(dāng)前頁面或主要內(nèi)容相關(guān)的引用、側(cè)邊欄、廣告、nav元素組，以及其他類似的有別與主要內(nèi)容的部分

8.

用于對(duì)元素進(jìn)行組合。一般用于圖片或視頻

1.  figure 的子元素,用于對(duì)figure的內(nèi)容進(jìn)行說明

2.2 講解標(biāo)簽