我有简单的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>
答案 0 :(得分:0)
因为你没有过渡? (点击方框)
#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;