📌  相关文章
📜  CSS | translate3d()函数

📅  最后修改于: 2021-09-02 05:02:20             🧑  作者: Mango

translate3d()函数是一个内置函数，用于在 3D 空间中重新定位元素。

句法： 

translate3d( tx, ty, tz )

参数：该函数接受上面提到和下面描述的三个参数：

  • tx：该参数保存x轴对应的平移长度。此参数以数字或百分比的形式保存值。
  • ty：此参数保存对应于 y 轴的平移长度。此参数以数字或百分比的形式保存值。
  • tz：此参数保存对应于 z 轴的平移长度。此参数仅以数字形式保存值。

下面的例子说明了 CSS 中的 translate3d()函数：

示例 1： 



  

    
      CSS translate3d() function
  
    

  

    
GeeksforGeeks

    
CSS translate3d() function

  
    
Original Image

    
    

  
    
Translated image

    

  

输出：

示例 2： 

 
 
 
    CSS translate3d() function 
     
 
  
 
    
GeeksforGeeks

    
CSS translate3d() function

      
    
Original Element

    
Welcome to GeeksforGeeks

      
    
Translated Element

    
Welcome to GeeksforGeeks
 
 

输出：

支持的浏览器： translate3d()函数支持的浏览器如下：

  • 谷歌浏览器
  • IE浏览器
  • 火狐
  • 苹果浏览器
  • 歌剧