关于旋转，设置了transform: rotate(0deg);起始值反而效果就不对了？
来源：3-3 编程练习
Cold丶cycle
2017-08-08 12:07:38
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>3-1作业</title>
<style>
div {
font-size: 14px;
font-weight: bold;
line-height: 50px;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 200px;
height: 50px;
margin: auto;
cursor: pointer;
text-align: center;
background: #abcdef;
/*此处写代码*/
transform: rotate(0deg);
transition: transform 2s ease 2s;
}
/*此处写代码*/
div:hover{
transform:rotate(360deg) scale(2,1);
transition:transform 2s ease 2s;
}
</style>
</head>
1回答
-
樱桃小胖子
2017-08-08
①旋转的过渡写的不正确，正确的应该是transition: all 1s;
②去掉 scale(2,1)
③在div:hover{}中设置
div:hover {
font-size: 18px;
line-height: 100px;
width: 400px;
height: 100px;
transform: rotate(360deg);
}
希望可以帮到你！
0
相似问题