css3 过渡不应该在 height: 100% 和 height: 200px 之间设置动画吗？答案

【问题标题】：Shouldn't css3 transitions animate between height: 100% and height: 200px?css3 过渡不应该在 height: 100% 和 height: 200px 之间设置动画吗？
【发布时间】：2011-10-12 02:40:05
【问题描述】：

css3 转换将插入 div 的高度状态。

目前，如果您将高度设置为与先前高度不同的单位，则 chrome13 将不会进行插值

即：

将高度设置为 100%

将高度设置为 50%（在不同的渲染帧上）

高度将正确动画（假设正确使用过渡）

将高度设置为 100px

高度不会动画

Chrome 错误？规范错误？

有动机的说明性 jsfiddle：http://jsfiddle.net/zDywJ/21/

【问题讨论】：

标签： animation css height interpolation transitions

【解决方案1】：

我认为这不是 Chrome 或规范中的错误。

据我所知，CSS 无法将百分比更改为像素单位......因此它无法比较开始和结束以执行过渡。

【讨论】：

这是循环推理——“css 做不到，因为 css 做不到。” css 有一个运行时组件，它当然可以计算出 100% 评估为多少像素。在我上面的示例中更改样式时，运行时已经知道此信息。由于这个缺陷，当前的设计在表现力上受到严重限制。