Transiciones (funciones de transición)

Un tercer parámetro opcional de la propiedad transition es indicar una "función de transición" que nos permite seleccionar la velocidad durante la transición:

Elemento {
      transition: [nombre de propiedad] [duración de la transición] [función de transición];
}

Los valores posibles que podemos especificar son:

La sintaxis luego si queremos aplicar la función de transición linear será:

#recuadro2{
  margin: 5px;
  border-radius: 20px;  
  background-color:#eee;
  width:200px;
  padding:10px;
  transition:width 2s linear;
  -moz-transition:width 2s linear;
  -ms-transition:width 2s linear;
  -webkit-transition:width 2s linear;
  -o-transition:width 2s linear;
}

Retornar