如何让一个div上下跳动

隔壁老王seabiscuit

于 2021-12-02 10:45:31 发布

阅读量577

点赞数

分类专栏： # 前端Html、Css 文章标签：前端 css3

本文链接：https://blog.csdn.net/weixin_44959855/article/details/121654248

版权

前端Html、Css 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

效果图:

在这里插入图片描述

代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>div上下跳动</title>
</head>
<style>
    .box {
        width: 100px;
        height: 100px;
        background-color: #096;
        margin: 100px auto;
        animation: bounce-up 1.5s linear infinite;
    }
    @keyframes bounce-up {
        25% {transform: translateY(10px)}
        50%, 100% {transform: translateY(0)}
        75% {transform: translateY(-10px)}
    }
</style>
<body>
    <div class="box"></div>
</body>
</html>

隔壁老王seabiscuit

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
如何让一个div上下跳动

效果图:代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>div上下跳动</title></head><style> .bo
复制链接

扫一扫