rgba compatible con Internet Explorer

En CSS3 la propiedad rgba consiste en dar un color RGB y una transparencia alpha.

Su uso es el siguiente:

[cc lang=”css” escaped=”true”]
#contenido{
background-color:rgba(236, 26, 105, 0.5);
}
[/cc]

Donde los 3 primeros valores corresponden a la formación del color RGB, y el último valor indica la transparencia.

Esto es hermoso hasta ahora, pero qué sucede en Internet Explorer y sus distintas versiones? Si necesitas validar para IE, por suerte hay una solución muy sencilla y bonita de implementar, creada por Lea Verou. Sólo debes descargar el archivo rgba.php desde github. Ahora debemos crear un directorio llamado “colors”, donde allí se guardarán automáticamente los 3 png’s que forman el color con transparencia que queremos lograr, del resto se encargará el .php.

Implementación

en nuestro CSS debemos agregar:

[cc lang=”css” escaped=”true”]
#contenido{
background-color:rgba(236, 26, 105, 0.5);
background: url(‘rgba.php/rgba(236, 26, 105, 0.5)’);
}
[/cc]

Y listo!! podés ver el demo aquí. Ahora podés disfrutar de las transparencias y usarlas a discreción y con sabiduría! <3 mas info en la página oficial

Si deseas podés revisar esta guía: Colores RGBA, HSL y HSLA en CSS3 en el curso de CSS3 por @ajnavajas

Te interesó? ¡Compartilo!
Tweet about this on TwitterShare on TumblrShare on Google+Share on LinkedInShare on FacebookPin on Pinterest

ESPACIO DE PUBLICIDAD