Question

我完全坚持这个旋转跨度的例子。 http://jsfiddle.net/C94b8/1/。我想要做的是从输入旋转包含val的旋转，但我无法实现。还尝试将范围更改为display: inline-block。也没用。

Answer 1

您需要将显示设置为内联块。此外，Chrome还不支持未加前缀的转换。相反，您需要使用-webkit-transform。 Firefox支持所有内容，因此您不必担心。

此外，您不必使用0%和100%。如果您正在使用它，则可以使用from和to。

还有一件事：我认为IE不支持rotate。他们想要rotateZ。所以我改变了它。

成品？

@-webkit-keyframes spin {
    from {-webkit-transform: rotateZ(0deg);}
    to {-webkit-transform: rotateZ(360deg);}
}

@keyframes spin {
    from {transform: rotateZ(0deg);}
    to {transform: rotateZ(360deg);}
}

header span {        
    display: inline-block;
    /* All the rest of header span {} code goes here. I didn't copy it all. */
}

CSS动画：跨度旋转

1 个答案: