Falling love

  Taught himself web front-end for some time to write something, although seniors have written something like that, but I think this is very interesting, he wrote a man of few words said, look at my own.

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="爱心飘落">
  <meta name="Description"
  <style>
  <title> love falling </ title>>""= Content
    body{
        overflow:hidden;
        margin:0;
        position:fixed;
        width:100%;
        height:100%;
        background:url('images/1.jpg') no-repeat;
        background-size:cover;
    }
    
    .snowfall-flakes:before{
        content:"";
        position:absolute;/*绝对定位*/
        left:0;
        top:0;
        width:10px;
        height:16px;
        background-color:red;
        border-radius:5px 5px 0px 0px;
        transform:rotate(-45deg);
    }
    .snowfall-flakes:after{
        content:"";
        position:absolute;
        left:0;
        top:0;
        width:10px;
        height:16px;
        background-color:red;
        border-radius:5px 5px 0px 0px;
        transform:translateX(4.3px) rotate(45deg);
    }
  </style>
 </head>
 <body>
    <script src="https://files.cnblogs.com/files/kmust-city/snowfall.jquery.js"></script>
    <script src="https://files.cnblogs.com/files/kmust-city/jquery-1.2.6.min.js"></script>
    <script>
        $(document).snowfall({flakCount :100,maxSpeed :10})    
    </script>
 </body>
</html>

Results as shown:

 

 You can change your own background image, like that small goes by, I downloaded are used, ha ha.

Guess you like

Origin www.cnblogs.com/kmust-city/p/11448974.html