什么是CSS补间？

Question

什么是在css中完全补间以及我们在哪里使用它。当我在网上搜索所有我知道的是＆＃34;姿势到姿势选项是在整个序列中创建几个关键帧，然后填写间隙。填补这些空白被称为中间或补间＆＃34;。有人可以用示例代码片段向我解释。

Answer 1

补间不是CSS中经常使用的术语。正如您所发现它源于计算机动画。动画师不会告诉程序确切地如何渲染每个帧，而是告诉程序对象在两个关键帧中的位置＆＃34;程序会弄清楚如何在这两点之间转换对象。

在CSS中，我们通常使用术语＆＃34; animate＆＃34;，但概念是相同的。 MDN有一个很好的介绍here。这个简单的例子（来自文章）演示了如何从浏览器窗口的右边缘滑入<p>元素：

p {
  animation-duration: 3s;
  animation-name: slidein;
}

@keyframes slidein {
  from {
    margin-left: 100%;
    width: 300%; 
  }

  to {
    margin-left: 0%;
    width: 100%;
  }
}