YPprogramming

Posts

Showing posts from December, 2017

Pulse Animation Using HTML & CSS3.

- December 19, 2017

Pulse Animation Using HTML & CSS3. Pulse.html <!DOCTYPE html> <html> <head> <title>Css Pulse animaton</title> <link rel="Stylesheet" type="text/css" href="Style.css"> </head> <body> <div class="center"> <div class="Pulse">Pulse</div> </div> </body> </html> ========================================================================= Style.css body { margin: 0px; padding: 0px; background-color:#3c3c3c; } .center { position: absolute; top:45%; left:50%; transform: translate(-50%,-50%); } .Pulse { height: 100px; width: 100px; background: rgb(0,129,201); color:#fff; font-size: 40px; text-align: center; border-radius: 50%; line-height: 100px; font-family: chiller; text-transform: uppercase; animation:animate 3s linear infinite; } @keyframes animate { 0% { box-shadow: 0 0 0 0 rgba(0,129,201,0.8),0 0 0 ...

Hello World

- December 12, 2017

Hello World program Using C Language

Bouncing Ball using HTML & CSS.

- December 08, 2017

Bouncing Ball using HTML & CSS. Example.html <html> <head><link rel="stylesheet" type="text/css" href="Style.css"></head> <body> <div class="center"> <div class="ball"></div> <div class="shadow"></div> </div> </body> </html> ======================================================================== Style.css body { margin: 0px; padding: 0px; } .center { top:10%; left: 10%; position: absolute; transform: translate(-50%,-50%); } .ball { width: 100px; border-top: 50px solid #000; border-bottom: 50px solid grey; border-radius: 50%; animation:bounce 1s infinite linear; } .shadow { position:absolute; top:100px; left:30px; width:50px; height:10px; background:#262726; border-radius: 50%; opacity:.8; animation:shadow 1s infin...