Explicamos como hacer efectos de transparencia, cambiando la opacidad de elementos como capas, formularios e imágenes entre otros.
En esta ocasión mostraré un efecto bastante simpático que podemos aplicar en capas, imágenes, formularios, etc…
La propiedad opacity funciona tanto en Internet Explorer como en Firefox:
IE:
filter: alpha(opacity=50)
Firefox:
opacity: .5
Mozilla:
-moz-opacity:0.5
El siguiente ejemplo funciona en los dos navegadores:
<style type=”text/css”>
.ejemplo {width: 100%; background-color: red}
.opaco {filter: alpha(opacity=50); opacity: .5}
</style>
<p class="ejemplo">Ejemplo sin opacity.</p>
<p class="ejemplo opaco">Ejemplo con opacity a 50%.</p>
<p><img src="imagen.gif" width="100" height="109"><img src="imagen.gif" class="opaco" width="100" height="109"></p>
Ver ejemplo en marcha
Referencia: Os dejamos un link a otro artículo de DesarrolloWeb.com donde se ofrecen explicaciones adicionales y actualizadas sobre
cómo crear transparencia con CSS.
Compartir en redes sociales
Usuarios: 
08 de marzo de 2005
Valoración del artículo:
