más que HTML desarrollo web con estándares
Degradados lineares sin imágenes
Con la salida de la versión 3.6 de Firefox, los principales navegadores (Firefox, Safari e Internet explorer) ya soportan propiedades para hacer degradados lineares sin imágenes. Además, Google Chrome, al estar basado en Webkit, como Safari, es muy probable que lo haga próximamente.
En los navegadores basados en Gecko y Webkit, podemos hacer degradados con varios colores, en cualquier ángulo e incluso radiales. Lamentablemente, Internet explorer sólo permite degradados lineares entre dos colores, así que vamos a centrarnos en ese caso.
Internet explorer 5.5 y superiores
filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#FFFFFF', EndColorStr='#000000')"
GradientType puede tomar los valores 0 (degradado vertical) y 1 (degradado horizontal).
Firefox (y otros navegadores basados en Gecko 1.9.2 o superior)
background: -moz-linear-gradient(top, #ffffff, #000000);
El primer parámetro indica desde dónde empieza el degradado. Puede tener los valores: top (por defecto), bottom, left y right.
Safari (y otros navegadores basados en Webkit)
background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#000000));
left top y left bottom serían, respectivamente, los puntos de inicio y fin del degradado.
Más información y ejemplos más avanzados:
Comentarios
Los comentarios están cerrados.