小編給大家分享一下transform-origin屬性怎么用，希望大家閱讀完這篇文章后大所收獲，下面讓我們一起去探討吧！

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

transform-origin屬性用于改變被轉(zhuǎn)換元素的位置。在2D 轉(zhuǎn)換元素中可以改變元素 x 和 y 軸的位置；3D 轉(zhuǎn)換元素中還可以改變其 Z 軸的位置。

CSS3  transform-origin屬性

作用：transform-origin 屬性允許您改變被轉(zhuǎn)換元素的位置。2D 轉(zhuǎn)換元素能夠改變元素 x 和 y 軸。3D 轉(zhuǎn)換元素還能改變其 Z 軸。

語法：

transform-origin: x-axis y-axis z-axis;

注：該屬性必須與 transform 屬性一同使用。

CSS3  transform-origin屬性的使用示例

旋轉(zhuǎn)紅色的DIV元素，嘗試更改其X軸和Y軸：

  
HELLO

Rotate:

transform: rotateY:(45deg);



X-axis:

Y-axis:
transform-origin: 20% 40%;
 

效果圖：

看完了這篇文章，相信你對transform-origin屬性怎么用有了一定的了解，想了解更多相關(guān)知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝各位的閱讀！