;
body {
/* 设置透视视图效果 */
perspective: 500px;
}
上述代码 告诉浏览器 , 观察者的眼睛...距离 投影平面 500 像素 , 在 这个距离会影响 3D 转换元素的视觉效果 , 具体效果就是 " 近小远大 " ;
如果不设置 透视视图效果 , 那么 整个 三维空间 中 , 不管多远 , 显示的...标签盒子 大小都一样 ;
设置过渡动画
如果需要 为 3D 变换过程 设置过渡时间 , 只需要 在 父盒子 中设置 transition 属性即可 , transition 属性 设置 盒子模型 属性值变化时的过渡效果...;
/* 设置过渡动画 */
transition: all 0.5s;
上述代码 告诉浏览器 该 盒子模型 及 子盒子模型 所有 可过渡 的属性值在...:hover 是一个 伪类选择器 , 该选择器 表示 用户与页面进行交互的一种状态 , 即 鼠标指针停留在 盒子模型 上方时的一种状态 ;
.box:hover {