CSS training institute in delhi NCR & gurgaon | CSS training institute in gurgaon

Those effects we add in our elements to change the styling from one phase or more phase , without using flash or Javascript. For that the transition property we use.

For creating the Css transition property two things are mandatory part

Css property in which we want to add the effect
Time duration for the effect.

Let's understand this by the following program:-

<!DOCTYPE html>

<html>

<head>

<style>

#demo {

      height: 100px;

      width: 200px;

      background:green;

      transition:2s;

}

#demo:hover {

      background-color:blue;

      width: 500px;

}

</style>

</head>

<body>

<div id="demo"> </div>

<h5> Move cursor around the box </h5>

</body>

</html>

Output of the Program

Move cursor around the box

So in this way can give transition or easiness to our elements.

CSS 3 training insitute | Best IT Training classes in Gurgaon | Web Designing Training Institute