您的位置:首页技术文章
文章详情页

javascript - 如何用js或者css3实现元素边框的动态效果,如图?

【字号: 日期:2022-11-06 13:21:24浏览:58作者:猪猪

问题描述

javascript - 如何用js或者css3实现元素边框的动态效果,如图?

光圈可以是一个,就这样类似王者荣耀的头像框,怎么才能实现?

问题解答

回答1:

<!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>回答2:

用 css3动画属性,和transform

标签: JavaScript