转换比例:缩小比例的问题 [英] Transform scale: problem with scaling down

问题描述

我正遇到某种奇怪的

  div {内边距:60px;边距:100px;背景颜色:红色；过渡:1s；}div:hover {转换:规模(1.2);}  

 < div> abc</div>  

您遇到过这样的事情吗?是否由于某些性能问题而发生?

谢谢.

解决方案

请改用3D转换:

  div {内边距:60px;边距:100px;背景颜色:红色；过渡:1s；transform:perspective(100px)translateZ(0);}div:hover {transform:perspective(100px)translationZ(10px);}  

 < div> abc</div>  

I am facing to some kind of weird problem, which occurs after scaling down the element.

div{
  padding: 60px;
  margin:100px;
  background-color:red;
  transition:1s;
}
div:hover {
  transform:scale(1.2);
}

<div>abc</div>

Have you ever met with something like this? Does it occur because of some performance issue?

Thanks.

解决方案

Use a 3D transformation instead:

div{
  padding: 60px;
  margin:100px;
  background-color:red;
  transition:1s;
  transform:perspective(100px) translateZ(0);
}
div:hover {
  transform:perspective(100px) translateZ(10px);
}

<div>abc</div>

这篇关于转换比例:缩小比例的问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！