CSS3 - 可能带有 CSS 动画的 Chrome 浏览器错误？

Question

我有一个标签，并希望使用 CSS3 动画让它弹跳。这适用于所有最新浏览器，就像一个魅力。

但是，一旦我将display:inline 添加到标签，弹跳动画效果在 Chrome 浏览器上不起作用。它适用于所有其他浏览器，如 IE11、Firefox 和 Opera，但由于某种原因，它不适用于最新的 Chrome 浏览器。这是 Chrome 的错误还是有很好的解释？

这是一个测试用例：https://jsfiddle.net/fuex3nz1/1/

Answer 1

CSS 转换不适用于内联级别元素（我的意思是仅显示：内联和标签默认为内联级别）。你可以使用

.label {display:inline-block;}

有关 CSS 转换属性的更多信息，请查看 https://drafts.csswg.org/css-transforms/#terminology

对于内联元素，请查看http://htmlhelp.com/reference/html40/inline.html