文章專題學習下載問答程式設計字典遊戲最近更新

简体中文(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

作者最新文章