認(rèn)識html5

什么是html5?

html5 ≈ html5新增標(biāo)簽及規(guī)范 + CSS3 +javascript API(應(yīng)用程序接口 通過javascript調(diào)用)
HTML5的設(shè)計目的是為了在移動設(shè)備上支持多媒體。新的語法特征被引進(jìn)以支持這一點,如video、audio和canvas 標(biāo)記。HTML5還引進(jìn)了新的功能,可以真正改變用戶與文檔的交互方式。

html5屬性規(guī)范 自定義屬性必須以"data-"開頭:

<div id="" data-xxx=""></div>

img、input標(biāo)簽可以不用閉合

<img src="" alt="">
<input type="">

html5新增標(biāo)簽(1)

語義標(biāo)簽:
header、nav、main、aside、footer、section、article

<!-- header 頭部 -->
<header>
    <!-- nav 導(dǎo)航 -->
    <nav></nav>
</header>
<!-- main 內(nèi)容主體-->
<main>
    <!-- aside 側(cè)邊欄 -->
    <aside></aside>
</main>
<!-- footer 尾部 -->
<footer></footer>

<header>標(biāo)簽:<header>元素表示一組引導(dǎo)性的幫助,可能包含標(biāo)題元素,也可以包含其他元素,像logo、分節(jié)頭部、搜索表單等。

<footer>標(biāo)簽: <footer> 元素表示最近一個章節(jié)內(nèi)容或者根節(jié)點(sectioning root )元素的頁腳。一個頁腳通常包含該章節(jié)作者、版權(quán)數(shù)據(jù)或者與文檔相關(guān)的鏈接等信息。

<nav>標(biāo)簽:HTML導(dǎo)航欄 <nav>)描繪一個含有多個超鏈接的區(qū)域,這個區(qū)域包含轉(zhuǎn)到其他頁面,或者頁面內(nèi)部其他部分的鏈接列表。

<aside>標(biāo)簽:<aside> 元素表示一個和其余頁面內(nèi)容幾乎無關(guān)的部分,被認(rèn)為是獨立于該內(nèi)容的一部分并且可以被單獨的拆分出來而不會使整體受影響。其通常表現(xiàn)為側(cè)邊欄或者嵌入內(nèi)容。他們通常包含在工具條,例如來自詞匯表的定義。也可能有其他類型的信息,例如相關(guān)的廣告、筆者的傳記、web 應(yīng)用程序、個人資料信息,或在博客上的相關(guān)鏈接。

<main>標(biāo)簽:
(1)<main>標(biāo)簽不能是以下元素的繼承<article>、<aside>、<header>、<footer>、<nav>。
(2)在一個文檔中不能出現(xiàn)一個以上的<main>標(biāo)簽。
(3)<main>標(biāo)簽在PC端不支持IE瀏覽器,在手機(jī)端只支持Firefox火狐瀏覽器,所以不支持使用<main>標(biāo)簽。

可以使用article和section標(biāo)簽代替:

<header>
    <h1 class="logo">header</h1>
</header>
<section>
    <article>
        <section></section>
    </article>
    <aside class="aside"></aside>
</section>
<footer></footer>

<article>標(biāo)簽:<article>元素表示文檔、頁面、應(yīng)用或網(wǎng)站中的獨立結(jié)構(gòu),其意在成為可獨立分配的或可復(fù)用的結(jié)構(gòu),如在發(fā)布中,它可能是論壇帖子、雜志或新聞文章、博客、用戶提交的評論、交互式組件,或者其他獨立的內(nèi)容項目。

<section>標(biāo)簽:HTML Section 元素 (<section>) 表示文檔中的一個區(qū)域(或節(jié)),比如,內(nèi)容中的一個專題組,一般來說會有包含一個標(biāo)題(heading)。一般通過是否包含一個標(biāo)題 (<h1>—<h6>element)作為子節(jié)點 來 辨識每一個<section>。

讓IE6、7、8支持html5.官方給出的解決方案 -html5shiv.js

<script src="https://cdn.bootcss.com/html5shiv/r29/html5.min.js"></script>
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • HTML5 標(biāo)簽comment 注釋標(biāo)簽用于在源文檔中插入注釋。注釋內(nèi)容不會被瀏覽器顯示。為代碼編寫注釋的好處是...
    才気莮孒閱讀 4,228評論 1 25
  • IE8以下不兼容HTML5使用以下代碼,注釋if判斷當(dāng)瀏覽器為IE9以下時解析 新增標(biāo)簽 標(biāo)簽定義圖形,比...
    語目閱讀 344評論 0 1
  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 14,104評論 1 92
  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務(wù)發(fā)現(xiàn),斷路器,智...
    卡卡羅2017閱讀 136,525評論 19 139
  • 《CSS揭秘》技巧三中提到, 等價于: 為什么bottom right和100% 100%等價呢?請看下面: ba...
    6659a0f02826閱讀 1,627評論 0 0

友情鏈接更多精彩內(nèi)容