Heim > Artikel > Web-Frontend > Animieren Sie die CSS-Eigenschaft „padding-top“.

Animieren Sie die CSS-Eigenschaft „padding-top“.

PHPznach vorne: 2023-08-29 14:57:02749Durchsuche

对 CSS padding-top 属性执行动画

Um die Eigenschaft „padding-top“ mithilfe von CSS zu animieren, können Sie versuchen, den folgenden Code auszuführen:

Beispiel

Live-Demo

<!DOCTYPE html>
<html>
   <head>
      <style>
         div {
            width: 350px;
            height: 150px;
            outline: 3px solid maroon;
            animation: myanim 3s infinite;
         }
         @keyframes myanim {
            30% {
               padding-top: 60px;
            }
         }
      </style>
   </head>
   <body>
      <h1>CSS padding-top property</h1>
      <div> </div>
   </body>
</html>

Das obige ist der detaillierte Inhalt vonAnimieren Sie die CSS-Eigenschaft „padding-top“.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

css padding

Stellungnahme：

Dieser Artikel ist reproduziert unter:tutorialspoint.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen

Vorheriger Artikel：Verwenden Sie CSS, um Swing-Animationseffekte zu implementierenNächster Artikel：Verwenden Sie CSS, um Swing-Animationseffekte zu implementieren

In Verbindung stehende Artikel

Mehr sehen