css CSSアニメーション

Posted 2021-05-13

/* ショートハンド*/
div.sample {
animation: anime 5s ease 0 infinite alternate;
}

.anim {
    animation-duration: 4s;
    animation-name: anim-bright;
    animation-iteration-count: infinite;
    animation-timing-function: ease;
    animation-direction: alternate;
    animation-delay: 3s;
}

@keyframes anime {
0% {width: 50px; height: 50px; background-color: aqua;}
100% {width: 200px; height: 50px; background-color: blue;}
}