Opacity en CSS

Opacity

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

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>

Autor: Federico Javier Elgarte
http://www.cssboulevar.com.ar/leer.php/articulo/9

Usuarios que han visto este tema también han visto...

- Arreglar los bordes punteados en Internet Explorer con CSS
- FLOAT en CSS
- Personalizando las barras de scroll del navegador en CSS
- Botones con CSS
- Una hoja de estilo para diagnosticar fallos en el marcado

- Versión imprimible de este documento

- Enviar por e-mail este documento