HTML5新增標簽

一、什么是HTML5

HTML5HTML 標準的最新演進版本。 這個術(shù)語代表了兩個不同的概念:
它是一個新的 HTML 語言版本包含了新的元素,屬性和行為,同時包含了一系列可以被用來讓 Web 站點和應(yīng)用更加多樣化,功能更強大的技術(shù)。 這套技術(shù)往往被稱作 HTML5 和它的朋友們,通常簡稱為 HTML5。
從要對全部所有的 Web 開發(fā)人員有用這一點出發(fā),這個參考頁面鏈接了有關(guān) HTML5 技術(shù)的大量資源,并且基于它們各自的功能,把它們歸類成了若干組。
語義:能夠讓你更恰當?shù)孛枋瞿愕膬?nèi)容是什么。
連通性:能夠讓你和服務(wù)器之間通過創(chuàng)新的新技術(shù)方法進行通信。
離線 & 存儲:能夠讓網(wǎng)頁在客戶端本地存儲數(shù)據(jù)以及更高效地離線運行。
多媒體:使 video 和 audio 成為了在所有 Web 中的一等公民。
2D/3D 繪圖 & 效果:提供了一個更加分化范圍的呈現(xiàn)選擇。
性能 & 集成:提供了非常顯著的性能優(yōu)化和更有效的計算機硬件使用。
設(shè)備訪問 Device Access:能夠處理各種輸入和輸出設(shè)備。
樣式設(shè)計: 讓作者們來創(chuàng)作更加復(fù)雜的主題吧!

二、HTML5新增標簽

腳本:

<template> 通過JavaScript在運行時實例化內(nèi)容的容器

章節(jié):

<section> 定義文檔中的一個章節(jié),一般來說會有包含一個 heading
<nav>定義一個含有多個超鏈接的區(qū)域,這個區(qū)域包含轉(zhuǎn)到其他頁面,或者頁面內(nèi)部其他部分的鏈接列表
<article> 表示文檔、頁面、應(yīng)用或網(wǎng)站中的獨立結(jié)構(gòu),其意在成為可獨立分配的或可復(fù)用的結(jié)構(gòu)
<aside> 定義和頁面內(nèi)容聯(lián)度較低的內(nèi)容--如果被刪除,剩下的內(nèi)容仍然很合理
<header> 定義頁面或章節(jié)的頭部。它經(jīng)常包含logo、頁面標題和導(dǎo)航性的目錄
<footer> 定義頁面或章節(jié)的尾部。它經(jīng)常包含版權(quán)信息、法律信息鏈接和反饋建議用的地址
<main> 定義文檔中主要或重要的獨一無二的內(nèi)容。一個文檔中不能出現(xiàn)一個以上的<main>標簽

組織內(nèi)容:

<figure> 代表一個和文檔有關(guān)的圖例
<figcaption> 代表一個圖例的說明

文字形式:

<data> 將一個指定內(nèi)容和機器可讀的翻譯聯(lián)系在一起。但如果內(nèi)容是與time和date相關(guān)的,一定要使用<time>
<time> 代表日期和時間值;機器可讀的等價形式通過datetime屬性指定
<mark> 代表一段需要被高亮的引用文字,用來表示上下文的關(guān)聯(lián)性
<ruby> 表示被ruby注釋標記的文本,如中文漢字和它的拼音
<rt> 代表ruby注釋,如中文拼音
<rp> 代表ruby注釋兩邊的額外插入文本,用于在不支持ruby注釋顯示的瀏覽器中提供友好的注釋顯示
<bdi> 代表需要脫離父元素文本方向的一段文本。它允許嵌入一段不同或未知文本方向格式的文本
<wbr> 代表建議換行,當文本太長需要換行時將會在此處添加換行符

嵌入內(nèi)容:

<embed> 代表一個嵌入的外部資源,如應(yīng)用程序或交互內(nèi)容,換句話說,就是一個插件。如<embed type="video/quicktime" src="movie.mov" width="640" height="480">
<video> 代表一段視頻及其視頻文件和字幕,并提供了播放視頻的用戶界面
<audio> 代表一段聲音或音頻流。 <audio> 元素可以包含多個音頻資源, 這些音頻資源可以使用 src 屬性或者<source> 元素來進行描述
<source> 為<video>或<audio>這類媒體元素指定媒體源
<track> 為<video>或<audio>這類媒體元素指定文本軌道(字幕)
<canvas> 代表位圖區(qū)域,可以通過腳本在它上面實時呈現(xiàn)圖形,如圖表、游戲繪圖等
<svg> 定義一個嵌入式矢量圖
<math> 定義一段數(shù)學(xué)公式

表單:

<datalist> 代表提供給其他控件的一組預(yù)定義選項
<keygen> 代表一個密鑰對生成器控件
<output> 代表計算值
<meter> 代表滑動條
<progress> 代表進度條,用來顯示一項任務(wù)的完成進度

交互元素:

<details> 代表一個用戶可以(點擊)獲取額外信息或控件的小部件。與summary配合使用
<summary> 代表 <details> 元素的綜述或標題
<menuitem> 代表一個用戶可以點擊的菜單項
<menu> 代表菜單,呈現(xiàn)了一組用戶可執(zhí)行或激活的命令。這既包含了可能出現(xiàn)在屏幕頂端的列表菜單,也包含了那些隱藏在按鈕之下、當點擊按鈕后顯示出來的文本菜單。

最后編輯于
?著作權(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 標簽comment 注釋標簽用于在源文檔中插入注釋。注釋內(nèi)容不會被瀏覽器顯示。為代碼編寫注釋的好處是...
    才気莮孒閱讀 4,241評論 1 25
  • W3C文檔不可少! 新增全局屬性: data-yourvalue,hidden,Spellcheck,tabind...
    Mandy_jin閱讀 472評論 0 0
  • article : 定義article aside : 定義頁面內(nèi)容之外的內(nèi)容 audio : 定義聲音內(nèi)容 bd...
    一只dororo閱讀 336評論 0 1
  • 一、新增標簽 結(jié)構(gòu)標簽 相當于有意義的div標簽article:用于定義一篇文章header:定義頁面的頭部foo...
    大春春閱讀 2,407評論 0 5
  • H5新增的很多有意思的標簽,其中很多標簽就是對DIV的細化,賦予了DIV很多意義,但它實際還是相當于DIV,使用這...
    林_Han閱讀 949評論 0 0

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