transform translate

transform: translate是CSS中的一个属性，用于对元素进行平移变换。它可以通过指定偏移量来改变元素的位置。例如，transform: translate(-50%,-50%)表示将元素向左上方移动50%的宽度和高度。而transform: translate(0,100%)表示将元素向下移动整个元素高度的距离。\[1\]

另外，transform还有其他属性值，如translate3D用于定义3D转换，scale用于定义2D缩放转换，rotate用于定义2D旋转，skew用于定义2D倾斜转换等等。\[2\]

另外，transition是CSS中的另一个属性，用于控制元素的过渡效果。它可以指定过渡的属性、时间、速度变化和延迟时间等。例如，transition-property用于指定应用过渡的CSS属性的名称，transition-duration用于定义过渡效果花费的时间，transition-timing-function用于规定过渡效果的时间曲线，transition-delay用于规定过渡效果何时开始。\[3\]
#### 引用[.reference_title]
- *1* [CSS3中的transform、translate和transition](https://blog.csdn.net/weixin_43804496/article/details/114282158)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item]
- *2* *3* [transition transform translate 之间的区别](https://blog.csdn.net/Rayshaan/article/details/112130914)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]