When your website means business.

Animation, CSS3 | Type: CSSCSS Animations and Transitions

CSS syntax and examples.

Animation

SYNTAX
.example { 
animation: [animation-name] [animation-duration] [animation-timing-function] [animation-delay]; 
}

EXAMPLE
.box {
animation:  bounceIn 2s ease-in-out 3s;
}

Transitions

SYNTAX
.example { 
transition: [transition-property] [transition-duration] [transition-timing-function] [transition-delay]; 
}

EXAMPLE
.box {
  width: 150px;
  height: 150px;
  background: red;
  margin-top: 20px;
  margin-left: auto;
  margin-right: auto;
  -webkit-transition: background-color 2s ease-out;
  -moz-transition: background-color 2s ease-out;
  -o-transition: background-color 2s ease-out;
  transition: background-color 2s ease-out;
}

.box:hover {
  background-color: green;
  cursor: pointer;
}

Reference Links