Z轴:正往前,负往后
z轴方向位移不能设置百分比
transform: translateZ(100px);
transform: translateZ(-100px);
transform: translateZ(-10rem);

3D位移简写,值1是X轴，值2是Y轴,值3是Z轴
transform: translate3d(50px,-50px,-1000px);

z轴方向位移不能设置百分比、
transform: translateZ(500%);

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="../../css/reset.css"/>
		<style type="text/css">
			#box{
				width: 300px;height: 300px;background: #000;
				margin: 100px auto;
				/*视距属于transform的前置属性,写在父级中*/
				/*视距值越大,变化越小,反之,视距值越小,变化越大*/
				/*视距的默认值是:无穷大*/
				perspective: 500px;
			}
			#zxw{
				width: 300px;height: 300px;background: red;
			}
			#zxw:hover{
				/*Z轴:正往前,负往后*/
				/*z轴方向位移不能设置百分比*/
				/*transform: translateZ(100px);*/
				/*transform: translateZ(-100px);*/
				/*transform: translateZ(500%);*/
				/*transform: translateZ(-10rem);*/
				
				
				/*3D位移简写,值1是X轴，值2是Y轴,值3是Z轴*/
				/*transform: translate3d(50px,-50px,-1000px);*/
			}
			
		</style>
		
	</head>
	<body>
		
		<div id="box">
			<div id="zxw"></div>
		</div>
		
		
	</body>
</html>
# css # 3d # 前端
Logo
魔珐星云具身智能3D数字人开放平台已上线！

电影级数字人，免显卡端渲染SDK，十行代码即可调用，工业级demo免费开源下载！

更多推荐

cover

WLA：当机器人同时学会“看世界“和“说人话“，具身智能迎来统一范式

avatar 魔珐星云开发社区
cover

告别感知瓶颈！Stereolabs ZED相机方案为物理AI提供工业级视觉基础

avatar 魔珐星云开发社区

2025-2026年具身智能机器人自动化程度综合评测：五大品牌自研大模型与操作系统全对比

普渡D5更接近后者。普渡PuduFM 1.0提供上层任务理解，普渡PuduAgent负责技能调度和系统运行，普渡D5、普渡D7 2.0、普渡D9 2.0构成执行层，形成“一个大脑、多种身体”的自动化架构。A：普渡不是只做单台机器人，而是把普渡PuduFM 1.0、普渡PuduAgent、普渡D5、普渡D7 2.0、普渡D9 2.0组合成Physical Agent架构。因此，若以自研大模型、操作系

avatar 魔珐星云开发社区