文章专题学习下载问答编程词典手游最近更新

简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)

首页 > web前端 > css教程 > 正文

动画 CSS margin-bottom 属性

PHPz

发布： 2023-08-26 08:29:09

转载

1130 人浏览过

动画 CSS margin-bottom 属性

要在CSS中实现对margin-bottom属性的动画效果，您可以尝试运行以下代码

示例

在线演示

<!DOCTYPE html>
<html>
   <head>
      <style>
         p {
            animation: mymove 3s infinite;
            margin-bottom: 20px;
         }
         @keyframes mymove {
            70% {
               margin-bottom: 60px;
            }
         }
      </style>
   </head>
   <body>
      <p>This is demo text! This is demo text! This is demo text!
         This is demo text! This is demo text! This is demo text!
         This is demo text! This is demo text! This is demo text!
         This is demo text! This is demo text! This is demo text!
      </p>
      <p>This is demo text 2!</p>
   </body>
</html>

登录后复制

以上是动画 CSS margin-bottom 属性的详细内容。更多信息请关注PHP中文网其他相关文章！

来源：tutorialspoint.com

上一篇：使用 CSS 创建衰减阴影下一篇：Tailwind CSS 组件的顶级开源库

本站声明

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn

作者最新文章