Scribd Logo
Hochladen

Willkommen bei Scribd!

  • Doctype HTML

    Hochgeladen von

    ShakeelAhmed
    5 Ansichten3 Seiten
    Website file

    Copyright

    © © All Rights Reserved

    Verfügbare Formate

    DOCX, PDF, TXT oder online auf Scribd lesen

    Stufen Sie dieses Dokument als nützlich ein?

    Sind diese Inhalte unangemessen?

    Dieses Dokument melden
    Website file

    Copyright:

    © All Rights Reserved
    Als DOCX, PDF, TXT herunterladen oder online auf Scribd lesen
    Markieren Sie unangemessene Inhalte
    5 Ansichten3 Seiten

    Doctype HTML

    Hochgeladen von

    ShakeelAhmed
    Website file

    Copyright:

    © All Rights Reserved
    Als DOCX, PDF, TXT herunterladen oder online auf Scribd lesen
    Markieren Sie unangemessene Inhalte
    von 3

    <!

    DOCTYPE html>
    <html>
    <head>
    <title>DICE</title>
    <style type="text/css">
    body{
    background-color:rgba(69,69,69,0.3);
    }
    .container{
    padding: 10px;
    border-radius:10px;
    width: 250px;
    height: 250px;
    background-color: red;
    box-shadow: 10px 10px 10px -1px;
    margin: 0 auto;
    margin-top: 90px;
    position: relative;
    animation:dice 2s;
    }
    @-webkit-keyframes dice{
    0%{transform:translateY(-350px);}
    }
    @-webkit-keyframes one{
    0%{transform:translateX(-1150px);}
    }
    @-webkit-keyframes two{
    0%{transform:translateX(1150px);}
    }
    .dot{
    border-radius: 100px;
    background-color: white;
    position: absolute;
    width: 50px;
    height: 50px;
    top: 10px;
    }
    .one{
    animation:one 3s;
    float: left;
    position: relative;

    left: 20px;
    }
    .two{
    animation:two 3s;
    float: right;
    position: relative;
    right: 20px;
    }
    .three{
    animation:two 3s;
    float: left;
    position: relative;
    top: 100px;
    left: -30px;
    }
    .four{
    animation:one 3s;
    float: right;
    position: relative;
    top: 100px;
    right: -30px;
    }
    .five{
    animation:one 3s;
    float: left;
    position: relative;
    top: 190px;
    left: -80px;
    }
    .six{
    animation:two 3s;
    float: right;
    position: relative;
    top: 140px;
    right: 20px;
    }
    </style>
    </head>
    <body>
    <div class="container">
    <div class="dot one"></div>
    <div class="dot two"></div>
    <div class="dot three"></div>

    <div class="dot four"></div>


    <div class="dot five"></div>
    <div class="dot six"></div>
    </div>
    </body>
    </html>

    Das könnte Ihnen auch gefallen