发新话题
打印

CSS3 animation设置图片上下移动

CSS3 animation设置图片上下移动

HTML元素
<img src="./images/kaihu.png" alt="开户">

CSS样式
<style>
    img {
        width: 142px;
        height: 118px;
        position: relative;
        top: 0px;
        animation: myMove 2s infinite;
        -webkit-animation: myMove 2s infinite;
        /* infinite 表示无限循环 */
    }

    @keyframes myMove {
        0% {
            top: 0px;
        }

        50% {
            top: 100px;
        }

        100% {
            top: 0px;
        }
    }

    @-webkit-keyframes myMove {
        0% {
            top: 0px;
        }

        50% {
            top: 100px;
        }

        100% {
            top: 0px;
        }
    }
</style>

TOP

发新话题