除了使用比例尺之外，您还可以考虑
translateZ使用透视图。确保最初定义透视图，以避免在快速移动光标时产生不良影响：
.scalable{ transition: 0.3s ease-in-out; box-shadow: 0 6px 10px rgba(0,0,0,0.14); transform:perspective(100px);}.scalable:hover { transform:perspective(100px) translateZ(5px); box-shadow: 0 8px 40px rgba(0,0,0,0.25);}.card { width: 100%; background: white; padding: 20px;}body { width: 50%; height: 100%; background: #999; padding: 20px;}<div > <div>here's some description</div></div>减少模糊效果的一种方法是从负平移开始，然后回到0：
.scalable{ transition: 0.3s ease-in-out; box-shadow: 0 6px 10px rgba(0,0,0,0.14); transform:perspective(100px) translateZ(-5px);}.scalable:hover { transform:perspective(100px) translateZ(0px); box-shadow: 0 8px 40px rgba(0,0,0,0.25);}.card { width: 100%; background: white; padding: 25px;}body { width: 50%; height: 100%; background: #999; padding: 20px;}<div > <div>here's some description</div></div>
