這篇文章主要介紹了Css3中的transform漸變屬性怎么用，具有一定借鑒價值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

創(chuàng)新互聯(lián)公司主營夏縣網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營網(wǎng)站建設(shè)方案,App定制開發(fā),夏縣h5微信小程序開發(fā)搭建,夏縣網(wǎng)站營銷推廣歡迎夏縣等地區(qū)企業(yè)咨詢

translate()素從其當(dāng)前位置移動，根據(jù)給定的 left（x坐標(biāo)） 和 top（y坐標(biāo)）

translate(x,y)定義2d轉(zhuǎn)換 xy為數(shù)字 x正為右 負為左 y正為下 負為上

translate3d(x,y,z)定義3D轉(zhuǎn)換

scale()方法，元素的尺寸會增加或減少，根據(jù)給定的寬度（X軸）和高度（Y軸）參數(shù)

scale(x,y)定義2D轉(zhuǎn)換 x y為倍數(shù)

scale(2,4)把寬度轉(zhuǎn)換為原始尺寸的 2倍，把高度轉(zhuǎn)換為原始高度的 4倍

rotate()方法 素順時針旋轉(zhuǎn)給定的角度。允許負值，元素將逆時針旋轉(zhuǎn)

rotate(30deg)表示旋轉(zhuǎn)30度

matrix()方法

skew(x-angle,y-angle)定義 2D傾斜轉(zhuǎn)換，沿著 X和 Y軸。

transition過渡屬性transition-property屬性規(guī)定應(yīng)用過渡效果的 CSS屬性的名稱 比如：width

transition-property: none|all|property;

transition-duration屬性規(guī)定完成過渡效果需要花費的時間（以秒或毫秒計）。

transition-timing-function屬性規(guī)定過渡效果的速度曲線。

transition-timing-function: linear|ease|ease-in|ease-out|ease-in-out|cubic-

bezier(n,n,n,n); ease：規(guī)定慢速開始，然后變快

transition-delay屬性規(guī)定過渡效果何時開始。

例子：

div

{width:100px;

height:100px;

background:blue;

transition:width 2s;

-moz-transition:width 2s; /* Firefox 4 */

-webkit-transition:width 2s; /* Safari and Chrome */

-o-transition:width 2s; /* Opera */

}

div:hover

{

width:300px;

}

感謝你能夠認真閱讀完這篇文章，希望小編分享的“Css3中的transform漸變屬性怎么用”這篇文章對大家有幫助，同時也希望大家多多支持創(chuàng)新互聯(lián)，關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，更多相關(guān)知識等著你來學(xué)習(xí)!