具有多个属性的css转换适用于Firefox，但不适用于chrome

Question

我尝试添加样式变换旋转以及缩放到一组图像。我用了

img.style = "transform: rotate(" + object[k].angle + "deg) scale(0.2);";

使用此变换属性rotate和样式在firefox中正常工作，但是当在chrome上运行时，它可以正常运行。所以我尝试使用

img.style.webkitTransform = "rotate(" + object[k].angle + "deg) scale(0.2);";

在firefox和chrome中使用它时，只有缩放才有效。由于我对json的不同图像使用不同的旋转角度，我发现难以将它们称为样式sheet.css作为替代

Answer 1

这是因为字符串中的分号。 Chrome会将此视为您设置的样式的一部分，并忽略它，因为它认为它无效。删除它在Chrome中运行良好。变化：

img.style.webkitTransform = "rotate(" + object[k].angle + "deg) scale(0.2);";
                                                                          ^

要：

img.style.webkitTransform = "rotate(" + object[k].angle + "deg) scale(0.2)";