perspective 是 CSS 3D 变换中最重要的属性之一，它决定了 3D 元素的透视效果强度

简单来说，它控制了观众（视点）与 3D 元素之间的距离，从而影响 3D 变换的视觉效果

• 数值：表示视点与屏幕之间的距离（通常以像素为单位）
• 作用对象：应用于 3D 变换元素的父容器
• 效果：数值越小，透视效果越强（类似近距离观察）；数值越大，透视效果越弱（类似远距离观察）

工作原理

• 当 perspective 值较小时，视锥体较短，物体变形更明显
• 当 perspective 值较大时，视锥体较长，物体变形更轻微

必须配合transform-style才能使用

.parent {
  perspective: 1000px;
}

.child {
  transform-style: preserve-3d;
}

实际效果对比