transition:all 0.3s linear 0;
/*要過渡的屬性 過渡執行的時間 運動速度 何時開始*/
移動：
transform:translate(-50%,-40%); /*x軸位移-50% y軸位移-40%*/
transform:translatex(30px); /*x軸移動30畫素*/
transform:translatey(50px); /*y軸移動50畫素*/
transform:scale(.1,.2); /*寬度縮為0.1倍，高度縮為0.2倍*/
transform:scale(2); /*放大2倍，只有乙個值另乙個值自動*/
transform-origin:top right; /*設定旋轉中心為右上角*/
transform:rotate(50deg); /*順時針旋轉50度（預設以中心為旋轉點）*/
transform:skew(20deg,30deg); /*x軸傾斜20度，y軸傾斜30度*/animation:donghua 0.3s linear 0 infinite alternate forwards;
/*donghua 0.3s 勻速 0s後開始 無限迴圈 正反方向來回 保持 */
/*宣告動畫*/
@keyframes donghua
50%100%
}
transform:rotatex(10deg);
transform:rotatey(10deg);
transform:rotatez(10deg);
transform:rotete(10deg,20deg,30deg);
transform-style:preserve-3d; /*3d效果*/
過渡與變形
1.html body 2.加vh 視高 height 100vh vw a視線寬度 weight 100vw translate 平移 位移 不會影響其它元素位置 對行內標籤沒有效果。乙個值 只位移x軸 兩個值 第乙個值位移x軸，第二個值位移y軸 translatey y軸位移 translate...
CSS3的變形 過渡 動畫 關聯屬性
transform 可以對元素物件進行旋轉rotate 縮放scale 移動translate 傾斜skew 矩陣變形matrix。示例 transform rotate 90deg scale 1.5,0.8 translate 100px,50px skew 45deg,45deg 矩陣變形 m...
過渡與變形（1）
translate 位移 scale 縮放 rotate 旋轉 skew 傾斜 transform origin中心點 transform translate 100px,100px 可寫畫素，可寫百分比 相對於父級 可寫負數 transform translate 100px,100px rota...