html - CSS旋转动画关键帧

Question

我正在做一个CSS加载器，想了解@keyframes中的内容。

我看到装载机从状态转换为另一种装载机时使用的{from，To}，而其他人则使用{0％，100％}。两者在创建加载程序时都有什么区别，但是当我使用其中之一时，什么时候不使用。

从，到例子

@keyframes example {
		from {
			transform: rotate(0deg);
		}
		to {
			transform: rotate(359deg);
		}
}

0％，100％示例

@keyframes example {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}

Answer 1

如MDN documentation中所述：


  从
  
  起始偏移量为0％。
  
  至
  
  结束偏移为100％。




从specification：


  关键字from等于值0％。关键字为
  相当于值100％。