3、3d重要功能函數
(1) 3D位移
在CSS3中3D位移主要包括兩種函數translateZ()和translate3d()。translate3d()函數使一個元素在三維空間移動。
語法：translate3d(tx,ty,tz)tx：代表橫向坐標位移向量的長度;
ty：代表縱向坐標位移向量的長度;
tz：代表Z軸位移向量的長度。此值不能是一個百分比值，如果取值為百分比值，將會認為無效值。
translateZ()函數的功能是讓元素在3D空間沿Z軸進行位移。語法：translateZ(t)t：指的是Z軸的向量位移長度。
(2) 3D旋轉
在三維變形中，我們可以讓元素在任何軸旋轉。為此，CSS3新增三個旋轉函數：rotateX()、rotateY()、rotateZ()和rotate3d(x,y,z,a)。
rotateX(a)
rotateX()函數指定一個元素圍繞X軸旋轉，旋轉的量被定義為指定的角度;如果值為正值，元素圍繞X軸順時針旋轉;反之，如果值為負值，元素圍繞X軸逆時針旋轉。
rotateY(a)
rotateY()函數指定一個元素圍繞Y軸旋轉，旋轉的量被定義為指定的角度;如果值為正值，元素圍繞Y軸順時針旋轉;反之，如果值為負值，元素圍繞Y軸逆時針旋轉。
rotateZ(a)
rotateZ()函數和其他兩個函數功能一樣的，區別在于rotateZ()函數指定一個元素圍繞Z軸旋轉。
rotate3d(x,y,z,a)
x：是一個0到1之間的數值，主要用來描述元素圍繞X軸旋轉的矢量值;
y：是一個0到1之間的數值，主要用來描述元素圍繞Y軸旋轉的矢量值;
z：是一個0到1之間的數值，主要用來描述元素圍繞Z軸旋轉的矢量值;
a：是一個角度值，主要用來指定元素在3D空間旋轉的角度，如果其值為正值，元素順時針旋轉，反之元素逆時針旋轉。
3d旋轉
(3) 3D縮放
CSS3 3D變形中的縮放主要有scaleZ()和scale3d()兩種函數，當scale3d()中X軸和Y軸同時為1，即scale3d(1,1,sz)，其效果等同于scaleZ(sz)。通過使用3D縮放函數，可以讓元素在Z軸上按比例縮放。默認值為1，當值大于1時，元素放大，反之小于1大于0.01時，元素縮小
scale3d(sx,sy,sz)
sx：橫向縮放比例;
sy：縱向縮放比例;
sz：Z軸縮放比例;
scaleZ(s)
s：指定元素每個點在Z軸的比例。
注：scaleZ()和scale3d()函數單獨使用時沒有任何效果，需要配合其他的變形函數一起使用才會有效果
>>本文地址：http://www.jecan.cn/zhuanye/2020/48403.html
聲明:本站稿件版權均屬中公教育優就業所有，未經許可不得擅自轉載。
1 您的年齡
2 您的學歷
3 您更想做哪個方向的工作？
大前端
大數據
互聯網營銷
Java
Linux
Python
嵌入式
全域電商運營
軟件測試
室內設計
平面設計
電商設計
網頁設計
UI設計
VR/AR
網絡安全
新媒體
直播帶貨
智能機器人
中公教育IT培訓品牌
400-650-7353
Copyright©1999-2025
北京中公教育科技有限公司 .All Rights Reserved
京ICP備10218183號-88
京ICP證161188號
京公網安備11010802020723號
投訴建議：400-650-7353
Java培訓
軟件測試培訓
Web培訓
Linux培訓
Python培訓
互聯網營銷培訓
UI培訓
大數據培訓
官方公眾號 回復"大禮包"享福利 
領學習資料 分享IT知識 
閱讀()
分享
手機端入口
