为什么动画效果在谷歌浏览器是旋转放大在360浏览器是只放大不旋转呢
来源:1-1 课程介绍
Glimmering5426
2017-03-20 16:46:43
<!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;
-webkit-transform:rotate(0deg);
-moz-transform:rotate(0deg);
-ms-transform:rotate(0deg);
-o-transform:rotate(0deg);
transform:rotate(0deg);
-webkit-transition: transform 0.6s ease-in-out;
-moz-transition: transform 0.6s ease-in-out;
-ms-transition: transform 0.6s ease-in-out;
-o-transition: transform 0.6s ease-in-out;
transition: transform 0.6s ease-in-out;
}
div:hover{ -webkit-transform:rotate(-360deg) scale(1.5);
-moz-transform:rotate(-360deg) scale(1.5);
-ms-transform:rotate(-360deg) scale(1.5);
-o-transform:rotate(-360deg) scale(1.5);
transform:rotate(-360deg) scale(1.5);
-webkit-transition: transform 0.6s ease-in-out;
-moz-transition: transform 0.6s ease-in-out;
-ms-transition: transform 0.6s ease-in-out;
-o-transition: transform 0.6s ease-in-out;
transition: transform 0.6s ease-in-out;
}
</style>
</head>
<body>
<div>www.imooc.com</div>
</body>
</html>
1回答
小于飞飞
2017-03-20
你好,请将 div样式 中 transform:rotate(0deg) scale(1);补齐呦。希望对你有帮助,祝学习愉快,欢迎采纳。
相似问题