HTML5終極備忘大全（圖片版+文字版）

時間  2019-12-01
標籤 html5 html 終極 備忘 大全 圖片 文字 欄目 HTML5 简体版
原文   原文鏈接

原文地址：http://www.zhangxinxu.com/wordpress/?p=1544css

1、前言兼圖片備忘

下圖是我從testking網站上的Ultimate HTML5 Cheatsheat這篇文章中備忘圖片（已大小優化，由於圖片較高，故滾動顯示）。html

終極HTML5 備忘 張鑫旭-鑫空間-鑫生活

可是，上面畢竟是圖片格式（原圖上兆），並且仍是英文的，因此本身以爲有必要將上面的內容文字化，同時作下簡單的中文翻譯。整理一番，因而就有下面的些內容。html5

2、文字備忘之標籤

 

HTML5中新增的標籤
<article> 定義文章
<aside> 定義頁面內容旁邊的內容
<audio> 定義聲音內容
<canvas> 定義圖形
<command> 定義一個控制按鈕
<datagrid> 指樹或表格狀數據格式中的動態數據
<datalist> 定義一個下拉列表
<details> 定義一個元素的細節
<dialog> 定義會話或人的交談
<embed> 定義額外的交互內容或插件
<figcaption> 定義指定元素的標題
<figure> 定義一組媒體內容，以及他們的標題
<footer> 爲章節或頁面定義一個底部
<header> 爲章節或頁面定義一個頭部
<hgroup> 定義文檔中某段落的信息
<keygen> 定義表單生成的關鍵
<mark> 定義被標記的文本
<meter> 定義預約義範圍內的測量
<nav> 定義導航連接
<output> 定義某種類型的輸出
<progress> 定義任意種類任務的進程
<rp> 定義瀏覽器不支持ruby元素的替代者
<rt> 定義ruby註釋的解釋
<ruby> 定義 ruby 註釋（中文註音或字符）。
<section> 定義章節
<source> 定義媒體資源
<summary> 定義某"detail"元素的頭部
<time> 定義日期/時間
<video> 定義視頻
<wbr> 定義可能的換行

 

HTML5支持且同時存在於HTML4中的標籤
<!– …–> 定義註釋
<!DOCTYPE> 定義文檔類型
<a> 定義超連接
<abbr> 定義縮寫
<address> 定義地址元素
<area> 定義圖片地圖的某區域
<b> 定義加粗文字
<base> 定義整個頁面的基礎URL
<bdo> 定義文本顯示的方向
<blockquote> 定義一個長引用
<body> 定義主體元素
<br> 插入單個的換行
<button> 定義按鈕
<caption> 定義表格的標題
<cite> 定義引用
<code> 定義計算機代碼文本
<col> 定義表格列的屬性
<colgroup> 定義表格列的組
<dd> 定義個定義描述
<del> 定義刪除文本
<dfn> 定義個定義項
<div> 定義文檔章節
<dl> 定義定義列表
<dt> 定義定義項
<em> 定義強調文本
<fieldset> 定義控件組
<form> 定義表單
<h1>到<h6> 定義頭部1到頭部6
<head> 定義文檔信息
<hr> 定義水平線
<html> 定義個html文檔
<i> 定義傾斜文本
<iframe> 定義內聯替代窗口（框架）
<img> 定義個圖片
<input> 定義輸入域
<ins> 定義插入文本
<kbd> 定義鍵盤文本
<label> 定義表單控件的標籤
<legend> 定義控件組的標題
<li> 定義列表項
<link> 定義相關資源
<map> 定義圖片地圖
<menu> 定義菜單列表
<meta> 定義元信息
<noscript> 定義無腳本章節
<object> 定義內嵌對象
<ol> 定義一個有序列表
<optgroup> 定義個選項組
<option> 定義下拉列表選項
<p> 定義段落
<params> 定義object的參數
<pre> 定義預格式化文本
<q> 定義短引用
<s> 定義再也不正確的文本
<samp> 定義簡單的計算機代碼
<script> 定義腳本
<select> 定義可選擇列表
<small> 定義小點的文本
<span> 定義文檔章節
<strong> 定義強調的文字
<style> 定義一個樣式定義
<sub> 定義下標文字
<sup> 定義上標文字
<table> 定義表格
<tbody> 定義表格的主體
<td> 定義表格單元格
<textarea> 定義文本域
<tfoot> 定義表格底部
<th> 定義表格頭
<thead> 定義表格頭
<title> 定義文檔的標題
<tr> 定義表格行
<ul> 定義無序列表
<var> 定義變量

 

HTML5不支持的標籤
<acronym> 在HTML4.01中定義首字母縮略詞
<applet> 定義內嵌的小應用程序
<basefont> 定義文檔中基本的字體屬性
<big> 讓文字變大點
<center> 居中顯示文字或內容
<dir> 定義目錄列表
<font> 指定字體種類，大小，顏色等
<frame> 在框架集中定義獨有的窗體
<frameset> 定義框架集，包含多個窗體
<noframe> 當瀏覽器不支持框架的時候顯示文字
<strike> 定義刪除線文本
<tt> 定義電傳打字機文本
<u> 定義下劃線文字
<xmp> 定義格式化的文字

3、HTML5文字備忘之全局屬性

 

HTML5新添加全局屬性
contenteditable

指定是否容許用戶編輯內容css3

true | falseweb
contextmenu

定義元素的上下文菜單canvas

menu id瀏覽器
draggable

指定是否容許用戶拖拽元素ruby

true|false|autoapp
dropzone

指定當拖拽數據放開的時候會發生什麼框架

copy|move|link
hidden

指定元素不相干

hidden
spellcheck

指定是否元素要進行拼寫檢查

true | false
已存在的全局屬性
accesskey

指定訪問元素的快捷鍵

字符(character)
class

指定元素的類名（爲樣式表）

類名(classname)
dir

指定元素文本內容的對齊方向

ltr|rtl
id

爲元素指定惟一的id

id
lang

爲元素內容指定語言代碼

語言代碼(language code)
style

指定元素的內聯樣式

樣式定義(style definition)
tabindex

指定元素的tab順序

數值(nubmer)
title

指定元素額外的信息

文本(text)

4、HTML5文字備忘之事件屬性

1. window對象

 

window新增事件屬性
onafterprint 在文檔打印以後執行
onbeforeprint 在文檔打印以前執行
onbeforeloaded 在文檔加載完畢以前執行
onerror 當錯誤發生時執行
onhaschange 當文檔發生改變的時候執行
onmessage 當該信息被觸發的時候執行
onoffline 當文檔離線的時候執行
ononline 當文檔上線的時候執行
onpagehide 當窗體隱藏的時候執行
onpageshow 當窗體顯示的時候執行
onpopstate 當窗體歷史改變的時候執行
onredo 當文檔執行恢復上一次操做的時候執行
onresize 當窗體大小改變的時候執行
onstorage 當文檔加載ok的時候執行
onondo 當文檔執行恢復以前一次操做的時候執行
onunload 當用戶離開文檔的時候執行
window已存在事件屬性
onblur 當窗體失去焦點的時候執行
onfocus 當窗體得到焦點的時候執行
onload 當文檔加載完畢的時候執行

2. form表單的事件屬性

form表單新增事件屬性
oncontextmenu 當上下文菜單被觸發的時候執行
onformchange 當表單發生改變的時候執行
onforminput 當表單得到用戶輸入時候執行
oninput 當元素得到用戶輸入的時候執行
oninvalid 當元素驗證無效的時候執行

 

form表單已支持事件屬性
onblur 當元素失去焦點的時候執行
onchange 當元素改變的時候執行
onfocus 當元素得到焦點的時候執行
onselect 當元素被選擇的時候執行
onsubmit 當表單被提交的時候執行
HTML5不支持的form表單事件屬性
onreset 當表單重置的時候執行

3. 鍵盤事件

已存在的鍵盤事件屬性
onkeydown 當鍵按下的時候執行
onkeypress 當鍵按下並釋放的時候執行
onkeyup 當鍵擡起的時候執行

4. 鼠標事件

 

HTML5新增鼠標事件屬性
ondrag 當元素被拖拽的時候執行
ondragend 當元素拖拽操做結束的時候執行
ondragenter 當元素拖拽進入釋放對象的時候
ondragleave 當元素拖拽離開釋放對象的時候
ondragover 當元素拖拽通過釋放對象的時候
ondragstart 當元素拖拽操做開始的時候執行
ondrop 當拖拽元素被放開的時候
onmouswheel 當鼠標滑輪滾動的時候執行
onscroll 當元素的滾動條滾動的時候執行
已存在的鼠標事件屬性
onclick 當鼠標點擊的時候執行
ondbclick 當鼠標雙擊的時候執行
onmousedown 當鼠標按下的時候執行
onmousemove 當鼠標移動的時候執行
onmouseout 當鼠標移出元素的時候執行
onmouseover 當屬性進入元素的時候執行
onmouseup 當鼠標擡起的時候執行

5. 媒體事件

 

HTML5中新增媒體事件
oncanplay 當媒體能夠播放的時候執行
oncanplaythrough 當媒體能夠播放到最後的時候執行
ondurationchange 當媒體長度改變的時候執行
onemptied 當媒體資源元素變成空的時候執行
onended 當媒體已經到達最後的時候執行
onerror 當加載元素髮生錯誤的時候執行
onloadeddata 當媒體數據加載完畢的時候執行
onloadedmetadata 當媒體元素的持續時間加載完畢的時候執行
onloadstart 當瀏覽器開始加載媒體數據的時候執行
onpause 當媒體數據暫停的時候執行
onplay 當媒體數據繼續開始播放的時候執行
onplaying 當媒體數據已經開始播放的時候執行
onprogress 在瀏覽器正在獲取媒體數據的時候執行
onratechange 當媒體數據播放比率發生改變的時候執行
onreadystatechange 當ready-state發生改變的時候執行
onseeked 當元素的seeking屬性不是true的時候執行
onseeking 當元素的seeking屬性是true的時候執行
onstalled 當獲取元素數據發生錯誤的時候執行
onsuspend 當瀏覽器中止獲取媒體數據的時候執行
ontimeupdate 當媒體改變其播放位置的時候執行
onvolumechange 當媒體音量大小發生改變的時候執行，包括無聲
onwaiting 當媒體元素中止播放的時候
已存在的媒體事件屬性
onabort 碰到abort的時候執行

5、HTML5文字備忘之瀏覽器的準備狀況

支持：支持
不支持：不支持
部分支持：部分支持

注：下表格最右側三欄指移動設備上的瀏覽器支持狀況。

 

HTML5文字備忘之瀏覽器的準備狀況
  IE

 

8

 Firefox

 

3.6

 Chrome

 

9.0

 Safari

 

5.0

 Opera

 

11.0

   Android

 

2.3

 Safari

 

4.5

 Opera

 

10.0
Details & Summary元素 不支持 不支持 不支持 不支持 不支持   不支持 不支持 不支持
WebGL – 3D Canvas 製圖 不支持 不支持 支持 不支持 不支持   不支持 不支持 不支持
HTML5中內聯SVG 不支持 不支持 支持 不支持 不支持   不支持 不支持 不支持
Datalist元素 不支持 不支持 不支持 不支持 支持   不支持 不支持 支持
Progress & Meter 不支持 不支持 支持 不支持 支持   不支持 不支持 不支持
classList(DOMTokenList) 不支持 支持 支持 不支持 不支持   不支持 不支持 不支持
Ruby註解 部分支持 不支持 部分支持 部分支持 不支持   不支持 不支持 不支持
表單驗證 不支持 不支持 不支持 部分支持 支持   不支持 不支持 支持
Session歷史管理 不支持 不支持 支持 支持 不支持   支持 支持 不支持
HTML5表單特徵 不支持 不支持 支持 部分支持 支持   不支持 部分支持 支持
拖拽和拖放 支持 支持 支持 支持 不支持   支持 不支持 不支持
contenteditable屬性 支持 支持 支持 支持 支持   不支持 不支持 不支持
Canvas的文本API 不支持 支持 支持 支持 支持   支持 支持 不支持
Audio元素 不支持 支持 支持 支持 支持   支持 不支持 不支持
Video元素 不支持 支持 支持 支持 支持   支持 不支持 不支持
dataset & data – 屬性 部分支持 部分支持 支持 部分支持 部分支持   部分支持 部分支持 部分支持
新語義元素 不支持 部分支持 支持 支持 部分支持   支持 支持 部分支持
Canvas(基本支持) 不支持 支持 支持 支持 支持   支持 支持 支持
Hash改變事件 支持 支持 支持 支持 支持   支持 支持 不支持
離線web應用程序 不支持 支持 支持 支持 支持   支持 支持 支持
getElementsByClassName 不支持 支持 支持 支持 支持   支持 支持 支持
總支持率 21% 55% 85% 67% 64%   51% 50% 36%
相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程