suchen

Heim  >  Artikel  >  Web-Frontend  >  Animierende CSS-Margin-Bottom-Eigenschaft

Animierende CSS-Margin-Bottom-Eigenschaft

PHPz
PHPznach vorne
2023-08-26 08:29:091324Durchsuche

动画 CSS margin-bottom 属性

Um die margin-bottom-Eigenschaft in CSS zu animieren, können Sie versuchen, den folgenden Code auszuführen

Beispiel

Online-Demo

<!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>

Das obige ist der detaillierte Inhalt vonAnimierende CSS-Margin-Bottom-Eigenschaft. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：
Dieser Artikel ist reproduziert unter:tutorialspoint.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen
Vorheriger Artikel：Erstellen Sie Falloff-Schatten mit CSSNächster Artikel：Erstellen Sie Falloff-Schatten mit CSS

In Verbindung stehende Artikel

Mehr sehen