主流瀏覽器 + IE10以上支持CSS3。

CSS3解決兼容問題，加前綴：

chrom ， safire ：-webkit

firfox ： -moz

IE : -ms

opera : -o

CSS3簡化了前端工作人員的設計過程，加快頁面載入速度。

CSS3屬性集合：

border-radius,圓角。border-radius:左上角 右上角 右下角 左下角。一個左側的半圓：高100px 寬50px 左上角50px 右上角0 右下角0 左下角50px;

box-shadow:陰影。box-shaow:X軸偏移量 Y軸偏移量 [模糊半徑(不可為負)] [擴展半徑(可為負，為負則是縮小半徑)] 顏色

border-image:為邊框設置背景圖片；border-image:url() [圖片地址] XXpx【圖片背景的寬度】 repeat(圖片的展示方式)【repeat,round(拉伸),stretch(平鋪) 】;

rgba(紅，綠，藍，透明度); 顏色疊加與透明度配合 得到的顏色； background-color:rgba(100,100,100,0.5);顏色值在1~255之間，百分比在百分之0-百分之100之間.

linear-gradient(方向，顏色):線性漸變；漸變的顏色和方向；background-image:linear-gradient(to top left,#f00,#ff0,#0f0);從右下角到左上角的先線性顏色漸變。

radial-gradient(半徑，顏色):徑向漸變；漸變的方式：circle || ellipse,漸變半徑,20px 漸變圓心位置:50px 50px;顏色；background-image:radial-grandient(circle,20px 30px at 100px 100px,#f00,#0f0);或者在圓心漸變：background-image:radial-gradient(circle at center,#f00,#0f0);

text-overflow:ellipsis(省略號) || clip(剪切); overflow:hidden; white-space:nowrap;

@font-face:{ font-family:"字體名稱"; src: "字體地址"; };嵌入服務端字體.

text-shadow:X偏移量 Y偏移量 blur（ 模糊程度） 顏色; text-shadow:2px 2px 3px #f00;

background-origin:border-box(從邊框開始) | padding-box(從內邊距開始) | content-box（從內容位置開始）;

CSS3深度學習