为啥代码和老师一模一样就是没有动画效果?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style >
body{
background-color: #ffa5a5;
}
.cen{
width: 200px;
height: 200px;
background-color: #D5093C;
/*阴影 水平 偏移 垂直 模糊度 颜色*/
box-shadow: 0px 0px 70px #D5093C;
/*执行调用时间*/
animation: 1s aj infinite;
}
.lef{
/*倒圆角*/
border-radius: 100px;
position: absolute;
top: 200px;
left: 200px;
}
.rig{
/*倒圆角*/
border-radius: 100px;
position: absolute;
top: 200px;
left: 341px;
}
.c{
/*旋转*/
transform: rotate(45deg);
position: absolute;
top: 269px;
left: 271px;;
}
/*div:hover{
/*放大*/
transform: scale(1.3);
} */
/*css动画*/
@keyframes aj{
0%{transform: scale(1)rotate(45deg);}
50%{transform: scale(1.1)rotate(45deg);}
100%{transform: scale(1)rotate(45deg);}
}
@-moz-keyframes name{
from{}
to{}
}
@-ms-keyframes name{
from{}
to{}
}
@-webkit-keyframes name{
from{}
to{}
}
</style>
</head>
<body>
<div class="cen lef"></div>
<div class="cen c"></div>
<div class="cen rig"></div>
</body>
</html>