Advertisement
Guest User

Untitled

a guest
Nov 22nd, 2019
116
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 0.76 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.  
  4. <head>
  5.     <meta charset="UTF-8">
  6.     <title>Animation</title>
  7.     <!-- <link rel="stylesheet" href="style.css"> -->
  8.     <style>
  9.         .box {
  10.             width: 200px;
  11.             height: 200px;
  12.             background-color: royalblue;
  13.             animation-name: appear;
  14.             animation-duration: 1s;
  15.         }
  16.  
  17.         body {
  18.             display: flex;
  19.             align-items: center;
  20.             justify-content: center;
  21.             min-height: 100vh;
  22.         }
  23.  
  24.         @keyframes appear {
  25.             from {
  26.                 opacity: 0;
  27.             }
  28.  
  29.             to {
  30.                 opacity: 1;
  31.             }
  32.         }
  33.     </style>
  34. </head>
  35.  
  36. <body>
  37.     <div class="box"></div>
  38. </body>
  39.  
  40. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement