Designer's Solutions

Monday, 29 April 2013

How to Create Multiple Backgrounds in html with CSS3

.box{
width:600px;
height:400px;
background:url(theworld_256.png), url(t_5.jpg);
background-repeat:no-repeat;
background-position: center bottom, left top;
padding:10px;
text-align:center;
}

Like as :

How to create inner shadow in Html with css

.box{
width:300px;
height:300px;
background:#FF9;
padding:10px;
-moz-box-shadow: inset 0 0 15px 10px #888;
-webkit-box-shadow: inset 0 0 15px 10px#888;
box-shadow: inset 0 0 15px 10px #888;
text-align:center;
}
Like as :

Saturday, 27 April 2013

How to Create Marquee Effects Without Marquee Tag in HTML5

Just copy and paste this...
Head section is :

<head>    <meta charset="utf-8" />    <script type="application/javascript">          var X = 800;           function mtxt() {             var canvas = document.getElementById("txt");             if (canvas.getContext) {                 var ctx = canvas.getContext("2d");                   // Set the banner text attributes                 ctx.fillStyle = "green";                 ctx.shadowOffsetX = 1;                 ctx.shadowOffsetY = 1;                 ctx.shadowBlur = 1;                 ctx.shadowColor = "red";                 ctx.font = "40px ariel";                   // Call the moveBanner() function repeatedly every 50 microseconds                 setInterval(function () { moveBanner() }, 50)             }         }           function moveBanner() {             var canvas = document.getElementById("txt");             if (canvas.getContext) {                 var ctx = canvas.getContext("2d");                   // Clear the screen                 ctx.clearRect(0, 0, 800, 100);                   // Display the text in the new position                 ctx.fillText("All Tutorial Zone", X, 50);                 X -= 3;                   // If the banner has reached the left end of the screen, resent the x-coordinate                 if (X < -230)                     X = 800             }         }     </script>    <title>Moving Banner</title></head>

Body section is :

Pages

Monday, 29 April 2013

How to Create Multiple Backgrounds in html with CSS3

How to create inner shadow in Html with css

Saturday, 27 April 2013

How to Create Marquee Effects Without Marquee Tag in HTML5