.arrow_up{ //居中
position: absolute;
left: 50%;
bottom: 100px;
color: white;
}
.arrow_up span{ //箭头形状设置
position: absolute;
width: 20px;
height: 20px;
top: 10px;
-webkit-transform:rotate(45deg);
border-top: 1px solid white;
border-left: 1px solid white;
margin-left: -10px;
opacity: 0;
-webkit-animation: up 2s infinite;
animation: up 2s infinite;
}
.arrow_up span:nth-of-type(2){
top: 20px;
}
.arrow_up span:nth-of-type(1){
-webkit-animation-delay: .15s;
animation-delay: .15s;
}
@-webkit-keyframes up{ //动画设置
0%{
opacity: 0;
-webkit-transform: translate(0, 0) -webkit-rotate(45deg);
}
50%{
opacity: 1;
-webkit-transform: translate(0, -20px) -webkit-rotate(45deg);
}
100%{
opacity: 0;
}
}
@keyframes up{
0%{
opacity: 0;
transform: translate(0, 0) rotate(45deg);
}
50%{
opacity: 1;
transform: translate(0, -20px) rotate(45deg);
}
100%{
opacity: 0;
}
}