Question

我有简单的html文档和少量的CSS。转换工作但不是过渡我尝试了很多东西，它看起来像我正在观看的教程的精确副本，我遗漏的语法是否有问题，或者还有其他的东西是什么？导致它不起作用？

<!DOCTYPE html>
<html>
    <head>
        <title>transition Learning</title>
        <meta charset="utf-8">
        <style>
            #testItem{
                background-color: blue;
                width: 80px;
                height: 80px;
                margin: 300px auto;
                transition: transform 600ms ease-in-out;
                transform: translate(200px,200px) rotate(45deg);
            }


        </style>
    </head>
    <body>
        <div id="testItem"></div>
    </body>
</html>

Answer 1

因为你没有过渡？（点击方框）

＆＃13;

#testItem.transition {
  transform: rotate(90deg);
}

#testItem{
                background-color: blue;
                width: 80px;
                height: 80px;
                margin: 300px auto;
                transition: transform 2s ease-in-out;
                transform: translate(0,0) rotate(45deg);
            }

＆＃13;

<div id="testItem"></div>

＆＃13;

{{1}}

＆＃13;

为什么这个过渡属性不适用于css？

1 个答案: