Die Blende kann eins sein, genau wie der Avatar-Rahmen von King of Glory. Wie kann das erreicht werden?
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> .boxA { position: relative; width: 200px; height: 200px; border:2px solid yellow; } .boxB { position: absolute; width: 10px; height: 10px; top: 0; left: 0; background-color: pink; animation: mymove linear 5s infinite; } @keyframes mymove { 25% { transform: translate(190px,0px); } 50% { transform: translate(190px,190px); } 75% { transform: translate(0px,190px); } 100% { transform: translate(0px,0px); } } </style> </head> <body> <p class="boxA"> <p class="boxB"></p> </p> </body> </html>
用 css3动画属性，和transform
用 css3动画属性，和transform