Maison > Questions et réponses > le corps du texte

javascript - Comment obtenir l'effet dynamique des bordures d'éléments avec js ou css3, comme le montre la figure?

L'ouverture peut en être une, tout comme le cadre de l'avatar de King of Glory, comment y parvenir ?

仅有的幸福

仅有的幸福2710 Il y a quelques jours1187

répondre à tous(2)je répondrai

PHP中文网2017-06-30 09:59:39

<!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>

répondre

世界只因有你

世界只因有你2017-06-30 09:59:39

Utilisez les propriétés d'animation CSS3 et transformez

répondre

Annulerrépondre