transtion這個(gè)效果是需要觸發(fā)才會(huì)發(fā)現(xiàn)的效果
4個(gè)參數(shù)
1礁扮、transtion-proprety 決定哪些因素可以觸發(fā)效果 默認(rèn)是ALL
例如 color變化有一個(gè)過(guò)渡效果
trainsition-proprety:color;
2 transition-durtation 決定這個(gè)動(dòng)畫(huà)執(zhí)行多長(zhǎng)時(shí)間
例如 2分鐘的
transiton-durtation:2s;
3 transtion-timimg-function 決定動(dòng)畫(huà)durtation這段時(shí)間執(zhí)行速度變化
例如 勻速
transiton-timimg-function:linear;
三個(gè)不同的方式
transiton-timimg-function:ease; 中間快 兩邊慢;
transtion-timing-function:steps(3,start)
transtion-timing-function:cubic-bezier(x1,y1,x2,y2);
4 transiton-delay 決寫(xiě)這個(gè)動(dòng)畫(huà)延時(shí)多長(zhǎng)時(shí)間執(zhí)行
例如 2秒才指行
transition-delay:2s;
5 組合寫(xiě)法
trainstion:2s;
trainstion:color 2s,width 2s ease 1s;
觸發(fā)方式：hover focus 點(diǎn)擊click 媒體查詢(xún)medio active
