Crear degradados mediante CSS

En los navegadores Webkit como Safari o Chrome, existe una propiedad CSS para crear degradados. Esta propiedad también ha sido agregada a Firefox, el problema es que no es estándar, y hay que especificar los parámetros correctos para cada navegador. Si queremos que nuestra web tenga, por ejemplo, un fondo degradado de gris a blanco y de arriba a abajo, escribiremos en la hoja de estilos, dentro de la etiqueta body lo siguiente :

          background-image: -moz-linear-gradient(top, #666, #fff);
          background-image: -webkit-gradient(linear, left top,left bottom, from(#666), to(#fff));
          background-image: linear-gradient(top, #666, #fff);

Deberemos indicar en el caso de Mozilla el punto de partida en este caso top, el color de inicio y el color de fin. Para el caso de navegadores webkit, indicaremos el tipo de degradado (en este caso lineal), el punto de origen y el punto de destino, el color de inicio y el color de fin. Añadiremos también la especificación W3C, aunque como hemos comentado anteriormente, no es todavía estándar.

Facebooktwittergoogle_plus