2 回答
TA贡献1802条经验 获得超6个赞
div{
width:100px;
height:100px;
background:red;
transition:1s ease;
}
div:hover{
transform:scale(2);
opacity:0;
}
TA贡献1785条经验 获得超8个赞
用动画啊,`<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>动画</title>
<style>
.div{
width: 100px;
height: 100px;
position: absolute;
background: #C94E00;
opacity: 1;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
animation: change 5s;
-moz-animation: change 5s;
-webkit-animation: change 5s;
-o-animation: change 5s;
}
@keyframes change{
from {width: 100px;height: 100px;opacity: 1;}
to {width: 500px;height: 500px;opacity: 0;}
}
</style>
</head>
<body>
<div class="div"></div>
</body>
</html>`
- 2 回答
- 0 关注
- 8296 浏览
添加回答
举报