介绍
在移动端的页面中，经常有翻页的提示效果，经常使用向下的箭头动画来提示；一般效果如下所示：
使用到的图片
使用到的图片，就是一个向下的箭头；这里可以下载我的图片使用；
或者也可以使用<>括号，然后通过旋转角度，使其向下；也可以；
代码
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><style>.look-more {position: fixed;bottom: 15%;width: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;}.look-more img:first-child{animation-delay: -1s; -webkit-animation-delay: -1s;}.look-more img:nth-child(2){animation-delay: -0.5s; -webkit-animation-delay: -0.5s;}.look-more img:last-child{animation-delay: 0s; -webkit-animation-delay: 0s;}.look-more img {stroke: #fff; fill: transparent;stroke-width: 2px;animation: downMove 2s infinite;-webkit-animation: downMove 2s infinite;}/* down */@keyframes downMove{0% {opacity: 0; }40% {opacity: 1; }80% {opacity: 0; }100% {opacity: 0; }}.look-more img {width: 12px;display: inline-block;}</style><body><div class="look-more"><img src="./xiangxia.png" alt=""><img src="./xiangxia.png" alt=""><img src="./xiangxia.png" alt=""></div></body></html>
至此，就可以实现一个循环滚动的向下的箭头动画；
