有時會遇到判斷新標籤、屬性的題目，沒找到適合應試的，所以自己來收集總結一下，只列舉那些現在兼容性尚可（IE10支持）的新屬性及其基本功能（以w3school爲準）。感覺玩w3school資料更新不是很及時，要是很關心一個屬性的兼容性問題可以上caniuse去查一下，很好用。本文中“+”表示大於等於。
HTML5新增標籤
格式：
定義有記號的文本
支持：IE9+
~~~
定義任何類型的任務的進度
支持：IE10+
max:number 規定任務一共要做多少工作
value:number 規定已經完成了多少任務
這兩個值之比就是圖上藍色和總條的比例
定義ruby註釋
支持：IE9+
圖像：
定義圖形
支持：IE9+
height:number 設置canvas的高度
width:number 設置canvas的寬度
大多數Canvas繪圖API都沒有定義在元素本身上，而是定義在通過畫布的getContext()方法獲
得的一個“繪圖環境”對象上
支持：IE9+
支持：IE9+
音頻/視頻：
定義HTML5聲音內容，比如音樂或其他音頻
支持：IE9+
在開始標籤和結束標籤之間放置文本內容，這樣老的瀏覽器就可以顯示出不支持該標籤的內容；
autoplay:如果出現該屬性，則音頻在就緒後馬上播放
controls:如果出現該屬性，則向用戶顯示控件，比如播放按鈕
loop:如果出現該屬性，則每當音頻結束時重新開始播放
muted:IE10+規定視頻輸出應該被靜音
preload:如果出現該屬性，則音頻在頁面加載時進行加載，並預備播放。如果同時存在autoplay則忽略該屬性
src:要播放的音頻的URL
爲或定義媒體資源，當有多個資源時，瀏覽器選擇它支持的文件（兼容性處理）
支持：IE9+
src:規定媒體文件的url
type:規定媒體資源的MIME類型：視頻：video/ogg，video/mp4，video/webm；音頻：audio/ogg，
audio/mpeg；
定義HTML5視頻
支持：IE9+
autoplay:如果出現該屬性，則視頻在就緒後馬上播放
controls:如果出現該屬性，則向用戶展示控件，比如播放按鈕
height:設置視頻播放器的高度
loop:如果出現該屬性，則當媒介文件完成後再次開始播放
muted:IE10+規定視頻的音頻輸出應該被靜音
poster:規定視頻下載時顯示的圖像，或者在用戶點擊播放按鈕前顯示的圖像
preload:如果出現了該屬性，則視頻在網頁加載時進行加載，並預備播放。如果使用autoplay則自動忽
略該屬性
src:要播放視頻的url
width:設置視頻播放器的寬度
結構：
支持：IE9+
支持：IE9+
編程：
爲外部應用程序（非HTML）定義容器
height:設置嵌入內容的高度
src:嵌入內容的URL
type:定義嵌入內容的類型
width:設置嵌入內容的寬度
HTML5新增全局屬性
spellcheck是否進行拼寫檢查的屬性；如果不符合語法會有紅色下劃線
支持：IE10+
這是一個段落。
draggable屬性規定元素是否可以拖動
支持：IE9+
圖像、鏈接默認是可以拖動的
這是一個可拖動的段落。
contenteditable 規定元素的內容是否可編輯
這是一個可編輯的段落。
CSS3新增屬性
動畫屬性：
animation除了animation-play-state屬性外的動畫屬性的縮寫
（順序-name、-duration、-timing-function
、-delay、-iteration-count、-direction）
支持：IE10+
animation-name規定@keyframes動畫的名稱
支持：IE10+
animation-duration規定動畫完成一個週期所花費的秒或毫秒
支持：IE10+
animation-timing-function規定動畫的速度曲線
支持：IE10+
linear動畫從頭到尾速度相同
ease默認。動畫以低速開始，然後加快，在結束前變慢。
ease-in動畫以低速開始
ease-out動畫以低速結束
ease-in-out動畫以低速開始和結束
cubic-bezier(n,n,n,n)貝塞爾曲線，可以自定義動畫運行速率
animation-delay規定動畫合適開始
支持：IE10+
animation-iteration-count規定動畫被播放的次數
支持：IE10+
animation-direction規定動畫在下一週期是否逆向的播放
支持：IE10+
normal正常播放
alternate動畫應該輪流反向播放
animation-play-state規定動畫是否在運行或暫停
支持：IE10+
paused動畫已暫停
running正在播放
animation-fill-mode規定對象動畫時間之外的狀態
支持：IE10+
none不改變默認行爲
forwards保持最後一個屬性值
backwards在animation-delay所指定的一段時間內，在動畫顯示之前，應用開始屬性值
both向前和向後填充模式都被應用
背景屬性：
background-clip規定背景的繪製區域
支持：IE9+
border-box背景被剪裁到邊框盒
padding-box背景被剪裁到內邊距框
content-box背景被剪裁到內容框
background-origin相對於內容框來定位背景圖像
支持：IE9+
padding-box背景圖像相對於內邊距來定位
border-box背景圖像相對於邊框盒來定位
content-box背景圖像相對於內容框來定位
邊框屬性：
border-bottom-left-radius向左下角添加圓角邊框（長度值和百分比），剩下三個同理
支持：IE9+
border-radius簡寫屬性，設置所有四個radius屬性
支持：IE9+
box-shadow向框添加一個或多個陰影
支持：IE9+
用法：box-shadow: h-shadow v-shadow blur spread color inset;
h-shadow水平陰影的位置，允許負值
v-shadow垂直陰影的位置，允許負值
blur可選，模糊距離
spread可選，陰影尺寸
color可選，陰影的顏色
inset可選，將外部陰影改成內部陰影
Box屬性：
overflow-x如果內容溢出了元素內容區域，是否對內容的左右邊緣進行剪裁
overflow-y如果內容溢出了元素內容區域，是否對內容的上下邊緣進行剪裁
visible不剪裁內容，可能會顯示在內容框之外
hidden剪裁內容，不提供滾動機制
scroll剪裁內容，提供滾動機制
auto如果溢出框，則提供滾動機制
no-display如果內容不適合內容框，則刪除整個框
no-content如果內容不適合內容框，則隱藏整個內容
Color屬性：
opacity設置元素的不透明度，0爲完全透明，1爲完全不透明
文本屬性：
text-overflow設置文字溢出時的處理
clip修剪文本
ellipsis顯示省略符號來代表被修剪的文本
string使用給定的字符串來代表被修剪的文本
text-shadow顯示文本的陰影效果
支持：IE10+
用法：text-shadow: h-shadow v-shadow blur color;
h-shadow水平陰影的位置，允許負值
v-shadow垂直陰影的位置，允許負值
blur可選，模糊的距離
color可選，陰影的顏色
過渡屬性：
transition過渡效果的縮寫
支持：IE10+
用法：transition: property duration timing-function delay;
transition-property過渡效果的css屬性名稱
transition-duration過渡效果需要多少秒或者毫秒
transition-timing-function規定速度效果的速度曲線
transition-delay定義過渡效果何時開始
值類似上面動畫
2D/3D轉換：
transform變換
支持：IE10+
用法：transform: none|transform-functions;
transform-origin設置旋轉元素的基點位置
支持：IE10+
用法：transform-origin: x-axis y-axis z-axis;
x-axis被置於x軸的何處，可能的值left、center、right、length、%
y-axis被置於y軸的何處
z-axis被置於z軸的何處
transform-property規定應用過渡效果的css屬性名稱
支持：IE10+
用法：transition-property: none|all|property;
Flex屬性
flex屬性用於設置或檢索彈性盒模型對象的子元素如何分配空間
支持：IE11+，IE10加-ms-前綴
flex: flex-grow flex-shrink flex-basis|auto|initial|inherit;
flex-grow元素相對擴展的量，都是1則等分
flex-shrink元素相對縮放的量
flex-basis元素的長度
auto等價於1 1 auto
none等價於0 0 none
initial設置爲默認值，0 1 auto
inherit從父元素繼承
flex佈局現在很火，這是它目前國內的兼容性
