過渡效果的設(shè)置
transition: ease開始和結(jié)束慢速
運動曲線
linear 勻速
ease 開始和結(jié)束慢
設(shè)置圓角
border-radius :50px;
陰影
box-shadow: 10px(水平) 10px(垂直) 10px(羽化) 10px(陰影) red 顏色
inset(內(nèi)陰影)
指定第幾個div
div:nth-child(1~10){}
變換,位移
transform: translate(50px,50px) 不影響文檔流
旋轉(zhuǎn)
transform: rotate(30deg)
縮放
transform:scale(0.5,0.2);
斜切
transform:skew(30deg,0);
位移
translate(度數(shù)) z y
css3有哪些新增的特性？
1.css權(quán)重
2.新增選擇器
3.css3圓角，陰影，rgba(顏色表示法)
4.transition過渡動畫
5.transform 變換
6.animation 動畫

元素旋轉(zhuǎn)
x軸旋轉(zhuǎn) transform:perspective(800px) rotatey

CSS過渡動畫：
transition:width 3s ease,height 3s ease 1s，background-color 3s ease 2s; 寬先變，用時3s,高1s后變,顏色2s后變
圓角：
border-radius:1s ease 3s;
transition:all 3s ease;一起變
運動曲線:
div:nth-child(1) 第一個div
box-shadow:左右，垂直，陰影清楚與否，陰影大小
insert 內(nèi)陰影
transition:all 1s linear:勻速
transition:all ls ease; 中間快
transition:all 1s ease-in;越來快，突然停
transition:all 1s ease-out;越來慢，慢慢停
transition:all 1s ease-in-out;同ease
貝塞爾曲線：回彈
display:none;默認隱藏
display:block;出現(xiàn)
變形：
transform:translate(30px,20px); 水平，垂直位移 不影響別的
旋轉(zhuǎn)：
transform:rotate(30deg) 轉(zhuǎn)30度
transform:scale(0.5,3) 縮放
transform:skew(30deg,0) 水平斜切45度，垂直不變

transform-style:preserve-3d;
默認Z軸旋轉(zhuǎn)
transform:perspective(800px) rotateX(45deg) X軸旋轉(zhuǎn)

變形中心點：
transition-origin:left center; 沿著左邊中心點轉(zhuǎn)
transition-origin:left top; 左上角
transition-origin:50px 50px;
transition:all 1s ease;
transform:rotate(90deg);

背面可見：(默認)
transition:all 1s ease;
transform-style:preserve-3d;
transform:perspective(800px) rotateY(0deg);
transform-visibility:hidden; 背面不可見
transition:rotateY(180deg); 翻轉(zhuǎn)

position:relative; 相對定位 父類定義，相對body
position:absolute; 絕對定位 相對父類
text-align:center; 文字居中

animation動畫：
animation:moving 1s ease 1s 5(infinite) alternate forwards; 一次1s,5次(不限次),原路返回 ，停后不跳回
animation-play-state:paused; 鼠標(biāo)移入暫停
running; 移入開動
@keyframes moving{
from{
width:100px;
}
to{
width:50px;
}
}
border-radius:50px; 圓